Ajax data를 Controller에서 받는 두 가지 방법 : Vo / Map

 

Ajax의 data를 Controller에서 받아야할 때가 자주 있는데
Vo를 만들어서 받는 방법이 있고 Map을 이용하는 방법이 있다.

 

1. Vo로 받는 방법

	var memberId = $("#memberId").val();
	var memberPass = $("#memberPass").val();
	
	var param = {"memberId":memberId, "memberPass":memberPass}
    
        $.ajax({
		anyne:true,
		type:'POST',
		data: JSON.stringify(param),
		url:"/memberModify",
		dataType: "text",
		success : function(data) {	
			alert("비밀번호 변경이 완료되었습니다.");
			location.href="/boardList";
		},
		error: function(jqXHR, textStatus, errorThrown) {
			alert("ERROR : " + textStatus + " : " + errorThrown);
		}
	});

해당 예제는 스프링부트 게시판 만들기에 있는 내용을 약간 변형한 것으로, parameter를 json형태로 만들어서 컨트롤러로 넘기는 작업을 한다.

 

 

    @RequestMapping(value="/memberModify", method=RequestMethod.POST)
	public String memberModifyPOST(@RequestBody MemberVO memberVO) throws Exception {

		boardService.memberModifyPOST(memberVO);

		return "memberModify";
	}

@RequestBody 어노테이션은 json형태를 java객체로 쓰겠다는 의미이고 String 형태로 받게 된다. MemberVO는 memberId, memberPass가 들어있는 객체이다. VO를 만들어쓸때는 어노테이션을 붙여 이렇게 쓰면 된다.

 

---

2. Map으로 받는 방법

	 $.ajax({ // 컨트롤러와 통신	    			
		 type: 'POST',
		 url: "/test",
		 data: {"id": id, 'email': email},
		 contentType: "application/json; charset=UTF-8",
		 success: function(data) {					
          		alert("성공");
		},
		error: function(jqXHR, textStatus, errorThrown) {
			alert("ERROR : " + textStatus + " : " + errorThrown);
		}		
	});

위의 예제처럼 ajax통신을 하는데 이번에는 Vo를 사용하지 않을 계획이라면, Map<String, Object>형태로도 받을 수 있다. 가끔 여러곳에서 Vo vs Map 이러면서 열띤 토론이 있는 것을 보았는데 글쎄 나도 뭐가 더 좋냐고 물으면 잘 모르겠다.

dddddddd

 

@RequestMapping(value="/test")
	public String test(@RequestParam Map<String, Object> param) {		
		
		String id = (String) param.get("id");
		return "test";
	}

이렇게해서 찍어보면 아주 잘 나온다.

 

기억하자 @RequestParam은
Ajax "text"로 받고 Ajax "Json"는 받을 수 없다!!!

@RequestBody는 VO!!!!