1. 程式人生 > >axios的post請求後臺(ThinkPHP5)接收不到資料

axios的post請求後臺(ThinkPHP5)接收不到資料

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


版權所有,歡迎保留原文連結進行轉載:)