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

本文讲述了在Vue项目中遇到的axios POST请求参数问题,重点在于区分params与data的区别,并提供了解决方案:一是全局设置Content-Type,二是利用qs库进行数据序列化。作者分享了详细配置步骤和推荐方法。
摘要由CSDN通过智能技术生成

最近做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/

版权所有,欢迎保留原文链接进行转载:)

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值