前端post请求Content-Type和后端对应的接收参数方式
今天遇到一个奇葩问题,废了大半天,原来是没有理解前端发送http请求传参方式,不同的content-type会进行不同传参,后台也要用不同的方式接受,在此记录一下;我们的程序使用的是前后端分离,前端使用vue,所有的请求都做的拦截的设置:// request拦截器设置service.interceptors.request.use(config => {switch (config.urlT
今天遇到一个奇葩问题,废了大半天,原来是没有理解前端发送http请求传参方式,不同的content-type会进行不同传参,后台也要用不同的方式接受,在此记录一下;
我们的程序使用的是前后端分离,前端使用vue,所有的请求都做的拦截的设置:
// request拦截器设置
service.interceptors.request.use(
config => {
switch (config.urlType) {
case 'autoService':
config.url = autoBaseURL + config.url
break
default:
config.url = appBaseURL + config.url
}
// console.log("改头",config.url);
const token = getToken()
if (token) {
config.headers['Authorization'] = token // 请求头设置自带 token
}
config.headers['Content-Type'] = 'application/json' // 请求的数据格式为 json
return config
},
error => {
console.log(error)
Promise.reject(error)
}
)
可以看到请求头的Content-Type被设置了application/json格式,但是后台有一个接口是使用@RequestParam注解接受,这样就提示请求错误:400 bad request;查了一下,原来application/json格式是把参数放入请求body中的,后台如果想接受,要使用@RequestBody才行,但是我又不能修改别人的接口,所以在前端中,我可以使用formdata方式进行传参:
searchData() {
let params = new FormData();
params.append('inputMac', this.inputMac);
getcode(params).then(res => {
this.result=res
})
}
这样就OK了;
总结Content-Type和后端对应的接收参数方式
Content-Type常用到的值:
- application/x-www-form-urlencoded 默认值;
- application/json : JSON数据格式;
- multipart/form-data;
- application/octet-stream : 二进制流数据(如常见的文件下载)
当然还有很多可选的值,这里就不一一列出了;
post请求
1、当使用form-data、x-www-form-urlencoded时:后台不可以用@RequestBody;可以用@RequestParam。可以理解成参数都在请求param中,而不在请求体;
2、当使用application/json时:后台json字符串部分可以用@RequestBody;url中拼接的参数可以用@RequestParam
从注解的维度考虑:
-
(@RequestBody Map map),(@RequestBody Object object);
application/json时候可用,form-data、x-www-form-urlencoded时候不可用 -
(@RequestParam Map map);
application/json时候,json字符串部分不可用,url中的?后面添加参数即可用,form-data、x-www-form-urlencoded时候可用,但是要将Headers里的Content-Type删掉 -
(@RequestParam String waterEleId,@RequestParam String enterpriseName);
application/json时候,json字符串部分不可用,url中的?后面添加参数即可用
form-data、x-www-form-urlencoded时候可用,且参数可以没有顺序(即前端传过来的参数或者url中的参数顺序不必和后台接口中的参数顺序一致,只要字段名相同就可以),但是要将Headers里的Content-Type删掉 -
(@RequestParam Object object);
不管application/json、form-data、x-www-form-urlencoded都不可用 -
既不是@RequestBody也不是@RequestParam,没有指定参数哪种接收方式: (Map map),(Object object);
application/json时候:json字符串部分不可用,url中的?后面添加参数不可用。
因为没有指定,它也不知道到底是用json字符串部分还是?后面添加参数部分,所以干脆都不可以用
form-data、x-www-form-urlencoded时都不可用 -
(HttpServletRequest request)
application/json不可用
form-data、x-www-form-urlencoded时可用
get请求
只能使用@RequestParam注解接受参数
从注解维度考虑:
- RequestBody – Map / Object
GET请求中不可以使用@RequestBody - (@RequestParam Map map)
在url中的?后面添加参数即可使用 - (@RequestParam String waterEleId,@RequestParam String enterpriseName)
在url中的?后面添加参数即可使用
(@RequestParam Object object)
GET请求中不可以使用
参考来源 https://blog.csdn.net/weixin_38004638/article/details/99655322
更多推荐
所有评论(0)