[Spring] SpringMVC02_비동기방식_BoardRestController생성

○ RestController는 비동기방식의 일만 처리하는 Controller

○  Rest전송방식 : 요청 URL + 전송방식(상태)을 묶어서 처리 가능.

           사용 이유 :  url의 통일성 및 단순

             ➤  하나의 url이 고유한 리소스를 처리하는 공통방식.

                 네트워크를  통해서 컴퓨터들끼리 통신할 수 있게 해주는 아키텍처 스타일, 웹에 최적화 되어있으며,

                 데이터 포맷이 JSON이기에 브라우저들 간에 호환성이 좋음. 

                                         ➤ JSON  

                                             : key-value쌍으로 이루어진 객체의 집합, 대부분 데이터 교환을 하는 데 사용

                                              - Java, C, Python등 어떤 언어나 플랫폼에 상관없이 JSON으로 표현 가능.

                                              -  JSON은 XML보다 간단하고 가벼워서 서버와 클라이언트 사이에서

                                                   데이터 전송시 더욱 빠르게 전송 가능.

1. Get 
   : url에 데이터를 포함시켜 요청 ➜ 보안에 취약 ➜ 주로,  조회할때만 사용
2. Post
     : url에 데이터를 노출시키지 않고 요청 ( 데이터는 바디에 포함)
      ➜ get방식보다 보안이 높음
      ➜ 주로,  노출되면 안되는 데이터 저장할 때 사용.

@RequestMapping
   1) value
       : url값으로 매핑 조건을 부여 ( 보통 호스트주소, 포트 번호를 제외한 url주소)
         ➜ 이는 다중 요청 가능하며 @RequestMapping({ "/hello", " / hello-bye",   "/hello/** " })형식 사용가능
             ex) @RequestMapping("/board")
   2) method
     : HTTP request메소드 값을 매핑조건으로 부여
       ➤ @ PostMapping : HTTP Post Method에 해당하는 단축표현, 서버에 리소스를 등록(저장)할때 사용.
       ➤ @ GetMapping : HTTP Get Method에 해당하는 단축표현, 서버에 리소스를 조회 할때 사용.
       ➤ @ DeleteMapping : 서버의 리소스를 삭제.
       ➤ @ PutMapping : 서버의 리소스를 모두 수정.
       ➤ @ PatchMapping : 서버의 리소스를 일부 수.

 

put 방식, main.jsp

function goUpdate(idx){
		var title =$("#nt" + idx).val();
		var content =$("#ta" + idx).val();
		var writer =$("#nw" + idx).val();
		//console.log(title+"/"+ content+"/"+writer);
		//boardUpdate.do로 요청을 통해 게시글을 수정하고 
		// 수정된 게시글 다시 불러와서 적용시키시오.
		$.ajax({
			url:"board/update",
			type:"put", //put방식 : 
			contentType: "application/json; charset=utf-8", 
			data:JSON.stringify({"idx":idx,"title":title, "content":content,"writer":writer}), //json객체의 stringfy함수를 사용. 문자열형태로 바꿔줌.
			success:loadList,
			error: function(){alert("error");}
		});
		
	}

 

BoardRestController.java

 @PutMapping("/update")
	 public void boardUpdate(@RequestBody Board vo) { //put방식으로 비동기 요청할때만 requestbody사용. requestbody는 vo를 사용하기 위해서
		 System.out.println("게시글 수정 기능수행");
		 mapper.boardUpdate(vo);
	 }
@PutMapping("/count")
	 public void boardCount(@RequestBody Board vo) {
		 mapper.boardCount(vo.getIdx());
	 }

/*
 * 선생님 방식
 * @PutMapping("/count/{idx}")
 *  public void boardCount(@PathVariable ("idx") int idx) {
 * mapper.boardCount(idx); }
 */

 

main.jsp

function goContent(idx){
		//display속성의 값을 가져옴.
		// 안 보이는 상태면 보이게 해줌.
		if($("#c"+ idx).css("display")=="none"){
			
			$.ajax({
				url:"board/"+ idx,
				type: "get",
				dataType:"json", //받아오는 데이터타입
				success: function(data){
					$("#ta"+idx).val(data.content);
				},
				error:function(){alert("error");}
			});
			
			$("#c"+ idx).css("display", "table-row");
			
			
		}else{
			$("#c"+ idx).css("display","none");
			// boardCount.do 요청해서 조회수를 1 올리고 게시글을 다시 불러와 적용시키시오.
			$.ajax({
				url:"board/count",  //pathvariable방식 : 경로부분에 값(idx)을 보내는 방식, url에 가독성을 올리기 위해서.
				type:"put",
				contentType:"application/json",
				data:JSON.stringify({"idx":idx}),
				success:loadList,
				error: function(){alert("error");}
			});
		}
	}