axios的post请求后台(ThinkPHP5)接收不到数据

Haley · · 17 次点击 · · 开始浏览    

最近做vue项目,做分页的功能,使用post给后台发送数据,使用接口还是工具(postman)都可获取数据,唯独axios获取不到;经过排除,发现这与axios的post传参格式有关系;

 this.$axios({
    method: 'post',
    url:url,
    params: {
        seller_id:seller_id
    }
}).then((res)=>{
 
})

在使用axios时,要注意到配置选项中包含params和data两者,以为他们是相同的,实则不然。
因为params是添加到url的请求字符串中的,用于get请求。而data(form-data)是添加到请求体(body)中的, 用于post请求。

解决方法

方法1:

配置如下:
在main.js里 设置配置,修改Content-Type

import axios from 'axios';
axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded';
Vue.prototype.$axios = axios;
Content-Type须配置为application/x-www-form-urlencoded,以数据量格式进行数据传输(不兼容ie)
方法2:(推荐)

安装qs,在 main.js里引入并且对数据进行序列化

import axios from 'axios';
import qs from 'qs';
Vue.prototype.$qs = qs;

或者

import qs from 'qs';
axios.interceptors.request.use((config) => {
    config.data = qs.stringify(config.data);
    return config;
}, function(error) {
    return Promise.reject(error);
});
作者:子恒|haley
博客园:http://www.cnblogs.com/mylly/
版权所有,欢迎保留原文链接进行转载:)

本文来自:Segmentfault

感谢作者:Haley

查看原文:axios的post请求后台(ThinkPHP5)接收不到数据

17 次点击  
加入收藏 微博
0 回复
暂无回复
添加一条新回复 (您需要 登录 后才能回复 没有账号 ?)
  • 请尽量让自己的回复能够对别人有帮助
  • 支持 Markdown 格式, **粗体**、~~删除线~~、`单行代码`
  • 支持 @ 本站用户;支持表情(输入 : 提示),见 Emoji cheat sheet