반응형

1. URL

	@GetMapping("/boardForm.do")
	public String boardForm() {
		return "boardForm";  //WEB-INF/views/boardBoard.jsp -> forward
	}

2. REDIRECT

	@PostMapping("/boardInsert.do")  // 내성 : 인터폴레이션
	public String boardInsert(Board vo) { // title, content, writer => 파라미터 수집(Board)
		mapper.boardInsert(vo);
		return "redirect:/boardList.do";  // redirect
	}

3. VO, DTO // JSON 데이터 형식으로 변환해서 리턴.

// @ResponseBody -> jackson-data bind(객체를 -> JSON 데이터 포맷으로 변환)
	@RequestMapping("/boardList.do")
	public @ResponseBody List<Board> boardList()
	{
		List<Board> list = boardMapper.getLists();
		return list;  // JSON 데이터 형식으로 변환해서 리턴.
	}

pom.xml

<dependency>
    <groupId>com.fasterxml.jackson.core</groupId>
    <artifactId>jackson-databind</artifactId>
    <version>2.9.8</version>
</dependency>

=> JSON VIEW 구글확장프로그램

순수한 데이터만을 전달하는 서버 =>  OPEN API 서버, REST 서버

서버는 브라우저나 모바일에서 필요한 순수한 데이터만을 전달하는 API 서버의 형태로 변환

서버는 클라이언트의 요청 결과를 XML이나 JSON의 형태로 전달하고, 브라우저나 모바일에서는 이를 가공해서 사용자에게 보여주는 방식 (URI : Uniform Resource Identifer)

<script
	src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.3/jquery.min.js"></script>
<script
	src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
<script type="text/javascript">
	$(document).ready(function(){
		loadList();    	 
	 });  
	 function loadList(){
		// 서버와 통신 : 게시판 리스트 가져오기
		$.ajax({
			url : "boardList.do",
			type : "get",
			dataType : "json",
			success : makeView,
			error : function(){ alert("error");  }    		
		});
	 }        
 	function makeView(data)
 	{
 		alert(data);
 	}
  	
  </script>

var fData=$("#frm").serialize();
$.ajax({
url : "boardInsert.do",
type : "post",
dataType : "fData",
success : loadList,
error : function() {
alert("error");
}
});

728x90
반응형

+ Recent posts