ajax 데이터 제어 @RequestParam @RequestBody

구현 목표는 시작, 끝 날짜, 지역명을 선택받아 조회를 누르면

비동기 방식으로 표에 값이 출력되는 것!

 

오늘 다룰 내용은 조회 전 조건값들을 서버로 넘길 수 있는지에 대한 내용이다!

 

$.ajax({
				url : "/togongda/searchCovidList",
				method : "POST",
				dataType : "JSON",
				data : JSON.stringify({
					"resultArray" : JSON.stringify(resultArray), 
                        "dateArray" : JSON.stringify(dateArray)  
				}),
				contentType : "application/json; charset=UTF-8",
				success : function(result) {
					grid1.resetData(result);
				}// suc
				 ,error:function(){   
				console.log('error');     
				}
			}); //ajax

resultArray, dateArray는 각 시도명, 날짜 범위를 뜻한다.

data를 console을 통해 찍어보면 이렇게 값이 찍힌다.

이 값들을  Map<String, Object> 형태로 받아올 건데 @RequestBody 어노테이션을 사용했다.

 

이전에 회원가입 시 닉네임 중복, 이메일 주소 확인 같이 비동기로 검증하는 코드를 작성할 때

그때는 @RequestParam을 썻던 기억이 있어서 바로 써봤는데 그런 파라미터는 없다고 에러가 났다.

 

대충 짐작하건데 여태 해왔던 건 스트링 문자열 몇 자만 왔다 갔다 하니까 그런가 보다

하고 다른 어노테이션을 찾아보고 해결했는데 다시 찾아보니 전혀 다른 내용이었다..!

 

---

 

@RequestParam은 기본적으로 url 상에서 데이터를 찾아서 그렇다고 한다.

togongda/resultArray=1234&dateArray=20220821

이렇게 나올게 아니면 파라미터로 넘겨줄 수가 없다 라는 내용이었다

 

결과적으로 @RequestBody를 통해 파라미터를 Map형태로 받아서 해결했는데

@RequestBody는 Request Body를 Java Object로 변환시키는 어노테이션이라고 한다!

 

그래서 도대체 그 바디가 뭐길래 싶어서 좀 찾아봤다.

 

모든 요청에 바디가 있진 않다고 하고 XML, JSON, Multi Form 등의 데이터를 담는다고 한다

 

 

http의 header이고 전송하는 데이터는 

이렇다고 한다.

 

아 이렇게 보내진 거구나..! 

 

response 탭에는 표에 뿌려줄 데이터들이 출력되었다.

 

---

정리하자면

json, xml 등 데이터를 파라미터로 넘겨야 할 때 @RequestParam은 url에 담아야 파라미터를 넘길 수 있는 어노테이션이기 때문에 json, xml을 넘겨줄 수 없고 이런 경우 @RequestBody를 사용해야 한다.