axios在uniapp中的使用

// service.js文件

import Vue from 'vue'
import axios from 'axios'
let baseURL = 'http://192.168.0.184:4001/user/'
const service = axios.create({
    withCredentials: true,
    crossDomain: true,
    baseURL,
    timeout: 6000
})

// request攔截器,在請(qǐng)求之前做一些處理
service.interceptors.request.use(
    config => {
        // if (store.state.token) {
        //     // 給請(qǐng)求頭添加user-token
        //     config.headers["user-token"] = store.state.token;
        // }
        console.log('請(qǐng)求攔截成功')
        return config;
    },
    error => {
        console.log(error); // for debug
        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 => {
    return Promise.reject(error)
})


axios.defaults.adapter = function(config) { //自己定義個(gè)適配器,用來適配uniapp的語法
    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("執(zhí)行完成:",response)
                response = {
                    data: response.data,
                    status: response.statusCode,
                    errMsg: response.errMsg,
                    header: response.header,
                    config: config
                };

                settle(resolve, reject, response);
            }
        })
    })
}
export default service
// main.js文件

import Vue from 'vue';
import App from './App';
import axios from './api/request.js'

Vue.config.productionTip = false;
Vue.prototype.$axios = axios
// user.js文件
const api = require("./api.js");
import Vue from 'vue';

// 獲取登陸驗(yàn)證碼
export const userRegister = (params) => {
    console.log("請(qǐng)求Vue:",Vue)
    return Vue.prototype.$axios.post(
        api.REGISTERVERIFICATIONCODE,
        params
    )
}
// index.vue 組件文件中
const USERS = require("../../api/users")
//.........
USERS.userRegister(params).then(res => {
            console.log("獲取登陸驗(yàn)證碼成功啦:",res)
        }).catch(err => {
            console.log("獲取驗(yàn)證碼失敗啦:",err)
        })

參考資料:
axios在vue中的封裝
axios請(qǐng)求數(shù)據(jù)獲取成功了,但沒有走then而是走了catch

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

友情鏈接更多精彩內(nèi)容