最近在做项目,用axios向后台发送post请求,具体的写法参照官方文档的写法:
// 发送 POST 请求
axios({
method: 'post',
url: ‘http://127.0.0.1:3000/login'
data: {
username: admin,
password: admin
}
}).then((value)=>{
console.log(value)
})
.catch(reason=>{console.log(reason)});
我发现,其实后台是接收到了post请求,但是一直无法解析我传过去的参数,而且我尝试用postman测试了一下接口,用postman时可以正确传参的,同时,我在后台打印了一下传过去的参数,发现username和password都是undefined,说明是我传参的方式出了问题。
找了很久都没有找到原因,然后我查阅了下网上资料,把传参改成了以下格式:
let param = new URLSearchParams()
param.append('username', 'admin')
param.append('password','admin')
axios({
method: 'post',
url: "http://127.0.0.1:3000/login",
data: param
})
.then((result) => { console.log(result) })
.catch((reason) => { console.log(reason) })
};
这个时候,发现后台已经可以接收到参数了。
查阅了下文档,发现:
- axios的get请求都是把参数放在params属性下,在post请求下有两种方法,一种是放在params属性中,适合传参较少且数据较简单的情况,另外一种是放在data属性中,如果传参中含有引号、等号、拼接的json串或传参的数据量较大时候使用;
- 源码是这样的:
//如果是带&&的参数的格式转成String
if(utils.isURLSearchParams(data){
setContentTypeIfUnset(headers, 'application/x-www-form-urlencoded');
return data.tostring();
}
//如果是object对象转成json格式
if(utils.isObject(data){
setContentTypeIfUnset(headers, 'application/json;charset=utf-8');
return JSON.stringfy(data);
}
- 我想起之前后台的服务器的配置,node后台一般会配置中间件解析数据,包含两种方式:
app.use(express.urlencoded({extended: true})) // 请求体参数是: name=tom&pwd=123
app.use(express.json()) // 请求体参数是json结构: {name: tom, pwd: 123}
看到这里就豁然开朗了,post请求的两种数据格式要和后台的解析方式相对应,如果后台固定了,就可以通过前端js代码对数据格式进行转换文章来源:https://www.toymoban.com/news/detail-518090.html
这个bug当时找了蛮久,关键是要知道出错的根本原因,才知道后面遇到类似的问题如果解决。文章来源地址https://www.toymoban.com/news/detail-518090.html
到了这里,关于axios中post请求后台接收不到参数的解释的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!