1.安裝axios $ npm install axios
2.找到以下路徑中文件路徑> node_modules > axios > dist > axios.js注釋代碼塊
axios.all = function all(promises) {
return Promise.all(promises);
};
3.使用axios的自定義請(qǐng)求adapter
axios.defaults.adapter = function (config) {
return new Promise ((resolve, reject) => {
console.log(config)
})
}
4.在webpack.base.config.js文件中找到resolve>alias,為axios添加別名
image.png
5.最后在main.js文件中配置
import Vue from 'vue'
import App from './App'
import axios from 'axios'
import qs from 'qs'
const baseUrl = process.env.NODE_ENV === 'development' ? 'https://www.baidu.com' : 'https://www.baidu.com'
axios.defaults.timeout = 30000
axios.defaults.baseURL = baseUrl
axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded;charset=UTF-8'
axios.defaults.adapter = function (config) {
return new Promise((resolve, reject) => {
let data = config.method === 'get' ? config.params : qs.stringify(config.data)
// wx小程序 發(fā)起請(qǐng)求相應(yīng) log 就可以看到熟悉的返回啦
wx.request({
url: config.url,
method: config.method,
data: data,
success: (res) => {
return resolve(res)
},
fail: (err) => {
return reject(err)
}
})
})
}
// 請(qǐng)求攔截器
axios.interceptors.request.use(function (request) {
// request.headers.token = 'token=11124654654687';
// console.log(request) // 請(qǐng)求成功
return request
}, function (error) {
// console.log(error); // 請(qǐng)求失敗
return Promise.reject(error)
})
// 添加響應(yīng)攔截器
axios.interceptors.response.use(function (response) {
console.log(response.data.data) // 響應(yīng)成功
return response
}, function (error) {
// console.log(error); // 響應(yīng)失敗
return Promise.reject(error)
})
Vue.prototype.$axios = axios
Vue.config.productionTip = false
App.mpType = 'app'
const app = new Vue(App)
app.$mount()
參考文章:
http://www.reibang.com/p/d646aa7d30d4
https://blog.csdn.net/weixin_38644883/article/details/84971955
