본문 바로가기
이슈 해결

[Error] ajax 사용 중 'JSON parse error: ~'

by 나는 유찌 2020. 2. 22.

 

 

ajax로 이것저것 해보던 중 에러를 만났다.

 

JSON parse error: Unrecognized token 'param1': was expecting (JSON String, Number, Array, Object or token 'null', 'true' or 'false'); nested exception is com.fasterxml.jackson.core.JsonParseException: Unrecognized token 'param1': was expecting (JSON String, Number, Array, Object or token 'null', 'true' or 'false')

 

 

 

오류 발생 ajax코드

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
$.ajax({
    url : "[[@{/ajax/testForm1}]]",
    type : "POST",
   data : ({
        param1 : param1,
        param2 : param2,
        param3 : param3,
        param4 : param4
    }),
    contentType: "application/json",
    dataType : "json",
    success : function(data) {
        console.log("success!")
    }
});

 

 

 

원인 :

4번째 줄의 data 안에는 내가 2번째 줄에 지정해 놓은 url로 넘겨주기 원하는 값들을 data라는 곳에 넣는 구문이다.

이때 ajax는 저 data를 문자열화 해주지 않기 때문에 Controller에서 받아줄 때에 에러가 생긴다.

 

 

 

해결

 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
$.ajax({
    url : "[[@{/ajax/testForm1}]]",
    type : "POST",
    data : JSON.stringify ({
        param1 : param1,
        param2 : param2,
        param3 : param3,
        param4 : param4
    }),
    contentType: "application/json",
    dataType : "json",
    success : function(data) {
        console.log("success!")
    }
});

4번째 라인에 'JSON.stringify'라는 구문이 추가된게 보인다.

JSON.stringify는 JSON 객체를 String 객체로 변환 시켜주기 때문에 Controller에서 에러 없이 받아주게 된다.