在uniapp中桶唐，我們可以通過原生的uni.request(OBJECT)方法發(fā)起網(wǎng)絡(luò)請求，但是這個請求方式不管是在h5茉兰、app尤泽、還是微信小程序，都是不支持cookie的规脸。這里就想到在vue項目中經(jīng)常用到的請求方式axios坯约，是支持cookie的，那我們是不是可以把axios也引入到uniapp中使用呢燃辖？有了這個想法鬼店，我們就開始動手做起來吧！
首先就是正常的安裝和引用axios：
一.安裝npm插件
在HbuilderX頂部菜單黔龟，選擇工具—>插件安裝妇智，選擇NPM安裝。
二.安裝axios
在你的uniapp項目的根目錄下氏身，運行命令行語句：
npm install axios
執(zhí)行完后會發(fā)現(xiàn)uniapp和vue的項目一樣巍棱，多了一個node_module文件夾，文件夾中多了一個axios文件夾蛋欣，即安裝成功航徙。
三.在main.js中引入axios
import Vue from 'vue'
import App from './App'
import axios from 'axios'
// create an axios instance
const service = axios.create({
baseURL: 'http://192.168.0.105:8090', // url = base url + request url
withCredentials: true, // send cookies when cross-domain requests
// timeout: 5000, // request timeout
crossDomain: true
})
Vue.prototype.$axios = service
四.創(chuàng)建axios.js文件，導(dǎo)出axios方法
import Vue from 'vue'
export default Vue.prototype.$axios
五.使用axios進行方法請求
到這一步陷虎，我們就可以用axios進行請求了到踏。但是問題也來了杠袱，這個請求方式在h5中可以執(zhí)行，但是在app和微信小程序運行的就會出現(xiàn)下面這個錯誤：
adapter是axios的適配器窝稿，可在adapter中設(shè)置屬于自己的請求方法楣富，這里報錯大概是axios默認的適配器并沒有被uniapp識別到，所以我們在這里就自己定義個適配器伴榔。這里就是基于Promise封裝了uniapp的request方法纹蝴，代碼如下：
axios.defaults.adapter = function(config) {
return new Promise((resolve, reject) => {
console.log(config)
var settle = require('axios/lib/core/settle');
var buildURL = require('axios/lib/helpers/buildURL');
uni.request({
method: config.method.toUpperCase(),
url: config.baseURL + buildURL(config.url, config.params, config.paramsSerializer),
header: config.headers,
data: config.data,
dataType: config.dataType,
responseType: config.responseType,
sslVerify: config.sslVerify,
complete: function complete(response) {
response = {
data: response.data,
status: response.statusCode,
errMsg: response.errMsg,
header: response.header,
config: config
};
settle(resolve, reject, response);
}
})
})
}
在main.js中放入這段自定義適配器的代碼，就可以實現(xiàn)uniapp的app和小程序開發(fā)中能使用axios進行跨域網(wǎng)絡(luò)請求踪少，并支持攜帶cookie塘安。
以上就是uniapp引入axios的方法分享。
