问题是什么
项目由jquery 转 vue
ajax 请求改成 axios
移植代码get 问题不大，但是post请求无法正确取到数据，甚至出现一请求后台就挂的情况
问题排查
1. 是我参数传错了嘛？
不会吧，copy过来的呀。对比了一下参数内容，一模一样的呀
2. 是我axios的写法写错了吗？
不是，因为写错的话，应该连数据都无法返回，但是现在的情况是，我不管发什么样的参数过去，都是返回一样的数据，说明前端传值无效
3. 再重新看下参数
旧框架
新框架
发现了两处不同
请求头中的
Content-Type不一样
一个是application/json，一个是application/x-www-form-urlencoded
解决问题
只要发现问题所在，这就好办了
- 在拦截器中，设置
Content-Type为application/x-www-form-urlencoded
//配置发送请求前的拦截器 可以设置token信息
axios.interceptors.request.use(
config => {
config.headers['Content-Type'] = "application/x-www-form-urlencoded";
return config;
},
error => {
return Promise.reject(error);
}
);
可是改完测试发现没有改动到，请求头中的Content-Type依然是application/json
- 引入qs
config.data = qs.stringify( config.data)
//配置发送请求前的拦截器 可以设置token信息
axios.interceptors.request.use(
config => {
config.data = qs.stringify( config.data);//关键代码
return config;
},
error => {
return Promise.reject(error);
}
);
到此终结撒花，完美解决
题外话qs 是何方神圣
qs.stringify
基本用法
// qs.stringify 则和 qs.parse 相反，是把一个参数对象格式化为一个字符串。
let params = { c:'b', a: 'd' };
qs.stringify(params)
// 结果是
‘c=b&a=d‘
参考文章
https://segmentfault.com/a/1190000015261229?utm_source=tag-newest
qs简介
