今天在做开发的过程中,遇到一个Bug,在此记录下来。流程:前端使用Ajax发送post 请求到后端SpringBoot,后端接受到数据之后发现多了一个 = ,查阅各种资料,排查问题,最终解决了问题,操作步骤如下:
- 原前端ajax代码:
var postURL = "你的URL地址";
$.ajax({
url: postURL,
data:encodeURIComponent(JSON.stringify(data.field)),//为了防止乱码 将json数据 编码后发送到后端
type:"post",
dataType:"application/json;charset=UTF-8",//设置数据格式 一定要设置 不然传输json数据 会出问题
success:function(data){
//do somethings
}
- 原后端数据接收方式
@PostMapping(value = "/xxx")
**//没有设置接收数据的Request的contentType
//默认是application/x-www-form-urlencoded;charset=UTF-8 方式接收**
@ResponseBody
public String xxx(@RequestBody String params){
//do somethings
}
- 解决办法:
- 前端使用Ajax发送数据设置数据的传输格式dataType,但是在发送http请求的时候contentType没有设置,默认是为application/x-www-form-urlencoded;charset=UTF-8,这种数据结构是一种 键值对 数据结构,在传输的时候将 json 当成了键 加了一个等号 值为空 所以传输到后端 会多出来一个 等号
var postURL = "你的URL地址";
$.ajax({
url: postURL,
data:encodeURIComponent(JSON.stringify(data.field)),//为了防止乱码 将json数据 编码后发送到后端
type:"post",
contentType: "application/json;charset=UTF-8", //指定请求头 contentType 即可解决
dataType:"application/json;charset=UTF-8",//设置数据格式 一定要设置 不然传输json数据 会出问题
success:function(data){
//do somethings
}
- 后端也做一些修改 与 前端对应
//加入 produce 指定接收的数据的格式
@PostMapping(value = "/xxx",produces = "application/json;charset=UTF-8")
@ResponseBody
public String xxx(@RequestBody String params){
//do somethings
//如果前端进行了编码 记得使用 URLDecoder.decode(params,"UTF-8")进行解码
}
- 重启项目 再次发送数据 后端成功拿到正确json 解决了 发送数据 多出=问题。