인턴 Day15 (추천, 스크랩 기능 구현하기)

0. Day15

- 배운 것 

1. 추천, 스크랩 기능 구현하기

이번에는 구현하면서 허무한 걸로 고생해서 할말이 많지만....참는다. 한줄 가지고 며칠을 오류 찾다가 시간 보내는 게 진짜 미칠 것 같다. 근데 또 하나 풀리기 시작하면 술술 풀려서 기분이 너무 좋아서 그래서 코딩하는거지.

 

아무튼 추천 수 구현하기는 간단한 듯 간단하지 않다. 클릭 이벤트 한번 같지만 취소하는 경우도 따져야 하고 여러가지 상황을 고려해야하기에 복잡하다. 

 

1. 추천, 스크랩 기능 구현하기

- 참고 사이트 : https://kimfk567.tistory.com/62 (god이라고 부르자)

  위 사이트의 코드를 수정해서 추천을 구현하였다.

 

- 추천 기능

• 추천버튼을 누르면 추천, 다시 누르면 추천취소
• 회원마다 게시글별 1개씩 추천가능(중복방지)
• 추천을 하면 해당 게시글을 올린 회원의 포인트(추천수) 가 1 증가, 취소시 1 감소
• 자기 자신은 추천 불가

- 스크랩 기능

• 스크랩 버튼을 누르면 스크랩 , 다시 누르면 스크랩 취소
• 자신의 글을 스크랩 못함

 

- 결과

 

2. @RequestParam

GET방식으로 넘어온 URI의 queryString을 받기에 적절해 html부터 단계별(?)로 밟아온 사람이라면 가장 쉽게 이해할 수 있을 어노테이션이다.

 

 

<boardcontroller.java>

@ResponseBody
	@RequestMapping(value = "/like", method = RequestMethod.POST)
	public int like(@RequestParam("bno") int bno, @RequestParam("memberid") String memberid) throws Exception{

		int likeCheck = boardService.likeCheck(bno, memberid);
		System.out.println("1");
		if(likeCheck == 0) {
			//좋아요 처음누름
			System.out.println("2");
			boardService.insertLike(bno, memberid); //like테이블 삽입
			boardService.updateLike(bno);	//게시판테이블 +1
			boardService.updateLikeCheck(bno, memberid);//like테이블 구분자 1
	
		}else if(likeCheck == 1) {
			System.out.println("3");
			boardService.updateLikeCheckCancel(bno, memberid); //like테이블 구분자0
			boardService.updateLikeCancel(bno); //게시판테이블 - 1
			boardService.deleteLike(bno, memberid); //like테이블 삭제
		}
		return likeCheck;
	}

<readview.jsp>

$("#like").on("click", function() {
			
			var bno = '${read.bno}';
			var memberid="${sessionScope.loginId}";
			var param = {
					bno : bno,
					memberid : memberid
			};
			  $.ajax({
				  type : "POST",  
		           url : "/board/like",
		           
		           data: param,
			        success : function(likeCheck){
			        	  if(likeCheck == 0){
		                    	alert("추천완료.");
		                    	location.reload();
		                    }
		                    else if (likeCheck == 1){
		                     alert("추천취소");
		                    	location.reload();

		                }
			        }
			    });
		})

view와 controller를 연결해주는 방법으로 ajax를 사용했는데... 아무리 해도 이틀을 고민해도 404오류를 해결 할 수 없었다. 정말 다양한거 다 해봤는데 결국 답은 controller에 RequestParam을 추가해주는 것이었다. 근데 찾으면 찾을 수록 

 

전달된 객체를 Controller 에서 받기 위해서

Form 전송 시에는 RequestParam Annotation을,

ajax로 전송 시에는 RequestBody를 사용하는 것을 볼 수 있습니다.

 

라는데 어떻게 된 일인지 전혀 모르겠다. 난 분명히 post를 사용했는데... 조금 더 공부하고 추가 할 예정.