uniapp中使用axios

Posted javaokchen

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了uniapp中使用axios相关的知识,希望对你有一定的参考价值。

//第一步 npm install axios --save

//第二步新建request.js文件
import Vue from \'vue\'
import axios from \'axios\'

let baseURL = \'https://xxx.xxx.com/\'

const service = axios.create({

baseURL, 
timeout: 6000, // request timeout
crossDomain: true

})

// request拦截器,在请求之前做一些处理
service.interceptors.request.use(config => {

    //添加请求头
    let token = uni.getStorageSync(\'token\') || \'\'
    if (token) {
        config.headers.Authorization = token
    }
    console.log(\'请求拦截成功\')
    return config;
},
error => {
    console.log(error); 
    return Promise.reject(error);
}

);

//配置成功后的拦截器
service.interceptors.response.use(res => {

if (res.data.status == 200) {
    return res.data
} else {
    return Promise.reject(res.data.msg);
}

}, error => {

if (error.response.status) {
    switch (error.response.status) {
        case 401:
            break;
        default:
            break;
    }
}
return Promise.reject(error)

})

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) {
            console.log("执行完成:", response)
            response = {
                data: response.data,
                status: response.statusCode,
                errMsg: response.errMsg,
                header: response.header,
                config: config
            };

            settle(resolve, reject, response);
        }
    })
})

}

export default service

//第三步在main中引入axios并挂载
import request from \'./common/request.js\';
Vue.prototype.$https = request;

以上是关于uniapp中使用axios的主要内容,如果未能解决你的问题,请参考以下文章

VSCode自定义代码片段14——Vue的axios网络请求封装

VSCode自定义代码片段14——Vue的axios网络请求封装

VSCode自定义代码片段14——Vue的axios网络请求封装

uniapp怎么和后端交互

uniapp下uni.request请求的封装

uniapp请求+uView2.0请求封装