在学习axios过程中,发现直接通过把json放到post里后台通过getParameter接收不到。
axios请求代码
axios.post('url',{'username':'name'}).then(function(value){})
然后,因为我们的参数是 JSON 对象,axios 帮我们做了一个 stringify 的处理。
而且查阅 axios 文档可以知道:axios 使用 post 发送数据时,默认是直接把 json 放到请求体中提交到后端的。那么,这就与我们服务端要求的 'Content-Type': 'application/x-www-form-urlencoded'
以及 @RequestParam
不符合。
解决方案
解决方案一
用 URLSearchParams 传递参数
let param = new URLSearchParams()
param.append('username', 'admin')
axios({
method: 'post',
url: 'url',
data: param
})
解决方案二
网上有很多方案说使用 axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded';
或者 {headers:{'Content-Type':'application/x-www-form-urlencoded'}}
我试了一下,其实这样还是不行的
还需要额外的操作,(我们要将参数转换为query参数)
引入 qs ,这个库是 axios 里面包含的,不需要再下载了。
import Qs from 'qs'
let data = {
"username": "admin",
}
axios({
headers: {
'deviceCode': 'A95ZEF1-47B5-AC90BF3'
},
method: 'post',
url: 'url',
data: Qs.stringify(data)
})
解决方案三
既然 axios 源码中有那么一段很关键的代码,那么,我们也可以通过修改 transformRequest
来达到我们的目的。
在 axios 的请求配置项中,是有 transformRequest
的配置的:
import Qs from 'qs'
axios({
url: 'url',
method: 'post',
transformRequest: [function (data) {
// 对 data 进行任意转换处理
return Qs.stringify(data)
}],
headers: {
'deviceCode': 'A95ZEF1-47B5-AC90BF3'
},
data: {
username: 'admin',
}
})
解决方案四
axios.post('/api/lockServer/search',"userName"='admin');