基于vue封装axios请求

import axios from 'axios';
import qs from "qs";

const url = "https://www.baidu.com"; //访问地址域名

axios.interceptors.request.use(
    config => {
        //如需添加token
        if (localStorage.getItem('token')) {
            config.headers["token"] = localStorage.getItem('token');
        }
        //拼接访问地址
        config.url = url + config.url;
        return config;
    },
    error => {
        return Promise.reject(error);
    }
);

//返回处理
axios.interceptors.response.use(
    response => {
        return response;
    },
    error => {
        return Promise.resolve(error.response);
    }
);

//返回状态码处理
function checkStatus(response) {
    // loading
    // 如果http状态码正常,则直接返回数据
    // console.log(response)
    if (
        (response && response.status === 200) ||
        response.status === 304 ||
        response.status === 400
    ) {
        return response.data;
        // 如果不需要除了data之外的数据,可以直接 return respnse.data
    }
    // 异常状态下,把错误信息返回回去
    return {
        status: -404,
        msg: "网络异常"
    };
}

function checkCode(res) {
    // 如果code异常(这里已经包括网络错误,服务器错误,后端抛出的错误),可以弹出一个错误提示,告诉用户
    if (res.status === -400) {
        // alert(res.msg)
        // console.log(res)
    }
    if (res.data && !res.state) {
        // alert(res.message)
        // console.log(res.message)
    }
    return res;
}

export default {
    //post json格式
    postJson(url, data) {
        console.log(data)
        return axios({
            method: "post",
            baseURL: "",
            url: url,
            data: data,
            timeout: 30000,
            headers: {
                "X-requested-With": "XMLHttpRequest",
                "Content-Type": "application/json; charset=UTF-8"
            },
            withCredentials: true // 允许携带cookie
        })
            .then(response => {
                return checkStatus(response);
            })
            .then(res => {
                return checkCode(res);
            });
    },
    //post键值对格式
    post(url, data) {
        console.log(data)
        return axios({
            method: "post",
            baseURL: "",
            url: url,
            data: qs.stringify(data),
            timeout: 30000,
            headers: {
                "X-requested-With": "XMLHttpRequest",
                "Content-Type": "application/x-www-form-urlencoded; charset=UTF-8"
            },
            withCredentials: true // 允许携带cookie
        })
            .then(response => {
                return checkStatus(response);
            })
            .then(res => {
                return checkCode(res);
            });
    },
    get(url, params) {
        console.log(url)
        return axios({
            method: "get",
            baseURL: "",
            url: url,
            params, // get 请求时带的参数
            timeout: 30000,
            headers: {
                "X-Request-With": "XMLHttpRequest",
                // "Content-Type": "application/x-www-form-urlencoded; charset=UTF-8",
                "Content-Type": "application/json"
            },
            withCredentials: true // 允许携带cookie
        })
            .then(response => {
                return checkStatus(response);
            })
            .then(res => {
                return checkCode(res);
            });
    }
};

猜你喜欢

转载自blog.csdn.net/Lc_style/article/details/109401785
今日推荐