前后端分离-前端传JSON后端接收到7B22...的问题解决
目录
前后端分离 - 前端传JSON后端接收到%7B%22…的问题解决
前后端分离 - 前端传JSON后端接收到%7B%22…的问题解决
一、问题重现
1. 前端代码:
//测试提交json
$('.test').click(function () {
let liaison = $('#liaison').val();
let mobile = $('#mobile').val();
let map = {
"liaison": liaison,
"mobile": mobile
};
let json = JSON.stringify(map);
console.log(json);
$.ajax({
url: '/..../testJson',
data: json,
type: 'post',
async: false,
success: function (result) {
console.log(result);
}
})
2. 后端代码
/**
* 测试json数据
*/
@PostMapping("/testJson")
@ResponseBody
public ApiResult testJson(@RequestBody String json){
log.info("json =========== {}", json);
return ApiResult.success();
}
3. 发送数据后得到结果截图
3-1. 前端console.log
3-2. 后端 log.info
二、出现原因
其实一看便知,是编码格式的问题。那么分两步走。
三、问题解决
1. 首先设置一下软件的编码格式,idea和webstorm一样设置
2. 前端页面数据编码格式设置
很简单,在ajax里面添加一句 contentType 搞定,添加后的ajax是这样的
$.ajax({
url: '/..../testJson',
data: json,
type: 'post',
async: false,
contentType: 'application/json;charset=utf-8',
success: function (result) {
console.log(result);
}
})