axios請求封裝

原創

2020-02-21 05:56

import {Message} from 'iview';
import {Modal} from 'iview';
// 配置API接口地址(加上export其他組件才能使用)
export const serverIp = 'http://127.0.0.1:82';
// 引用axios
const axios = require('axios');

// 自定義判斷元素類型JS
function toType(obj) {
    return ({}).toString.call(obj).match(/\s([a-zA-Z]+)/)[1].toLowerCase()
}

// 參數過濾函數
function filterNull(o) {
    for (const key in o) {
        if (o[key] === null) {
            delete o[key]
        }
        if (toType(o[key]) === 'string') {
            o[key] = o[key].trim()
        } else if (toType(o[key]) === 'object') {
            o[key] = filterNull(o[key])
        } else if (toType(o[key]) === 'array') {
            o[key] = filterNull(o[key])
        }
    }
    return o
}


function apiAxios(method, url, params, success, failure) {

    if (params) {
        params = filterNull(params)
    }
    axios({
        headers: {
            // 'Content-Type': 'application/x-www-form-urlencoded'   //設置頭信息
        },
        method: method,
        url: url,
        data: method === 'POST' || method === 'PUT' ? params : null,
        params: method === 'GET' || method === 'DELETE' ? params : null,
        baseURL: serverIp,
        withCredentials: true  //此處爲false的時候會造成多次請求不是一個會話
    })
        .then((res) => {
            if (res.data.code === "00" || res.data.code === "98") {
                if (success) {
                    success(res.data)
                }
            } else {
                if (failure) {
                    failure(res.data)
                } else {
                    Message.error({
                       content:'服務器錯誤:' + JSON.stringify(res.data.msg),
                       duration:5
                   });
                }
            }
        })
        .catch((err) => {
            if (err) {
                Message.error({
                    content:'axios請求出錯' + err,
                    duration:5
                });
            }
        })
}



// 返回在vue模板中的調用接口
export default {
    get: function (url, params, success, failure) {
        return apiAxios('GET', url, params, success, failure)
    },
    post: function (url, params, success, failure) {
        return apiAxios('POST', url, params, success, failure)
    },
    put: function (url, params, success, failure) {
        return apiAxios('PUT', url, params, success, failure)
    },
    delete: function (url, params, success, failure) {
        return apiAxios('DELETE', url, params, success, failure)
    }
}