request.js 4.18 KB
/*
 * @Description: 此文件主要创建 axios 实例,然后添加请求拦截器和响应拦截器
 * @Autor: renchao
 * @LastEditTime: 2023-06-02 10:07:55
 */
import axios from 'axios'
import Cookies from 'js-cookie'
import { Message } from 'element-ui'
import { endLoadingSubCount } from './requestLoading'

// create an axios instance
const service = axios.create({
    baseURL:
        process.env.NODE_ENV == "development"
            ? process.env.VUE_APP_BASE_API
            : window._config.baseUrl + "/",
    withCredentials: true,  //是否允许跨域
    headers: {
        'Content-Type': 'application/json; charset=utf-8'
    },
    timeout: 15000
})

// request interceptor
service.interceptors.request.use(
    config => {
        if (process.env.NODE_ENV === 'development') {
            const token = localStorage.getItem('token')
            // 添加请求头
            if (token) {
                config.headers['Authorization'] = 'Bearer ' + token
            } else {
                config.headers.delete('Authorization')
            }
        } else {
            const token = Cookies.get('token')
            // 添加请求头
            if (token) {
                config.headers['Authorization'] = 'Bearer ' + token
            } else {
                config.headers.delete('Authorization')
            }
        }
        return config
    },
    error => {
        // do something with request error
        console.log(error); // for debug
        return Promise.reject(error);
    }
)
window.__isNeedLogin = true
// response interceptor
service.interceptors.response.use(
    response => {
        /**
         *  对响应数据判断:
         *  如果成功返回数据,就通过return把数据返出去
         *  如果请求不成功,就在拦截器这里统一处理(组件的代码就不用关注错误的情况了)
         */
        if (response.status == 200) {
            return response.data;
        } else {
            handleErrorData(response.data);
        }
        return response;
    },
    error => {
        endLoadingSubCount()
        if (error.response.status === 401) {
            //todo: 需要解决 一个页面多个请求,刷新后此处会触发多次
            if (window.__isNeedLogin) {
                window.__isNeedLogin = false
                Message.error('token失效,请重新登录');
                let locationUrl = window.location.protocol + '//' + window.location.host + window.location.pathname;
                if (process.env.NODE_ENV === 'development') {
                    localStorage.removeItem('token')
                } else {
                    Cookies.remove('token')
                }

                if (window._config.casEnable) {
                    window.location.href = window._config.casBaseURL + '/logout?service=' + encodeURIComponent(locationUrl);
                } else {
                    router.replace({
                        path: '/login',
                        query: {
                            redirect: router.currentRoute.value.fullPath
                        }
                    })
                    return false
                }
            }

        } else {
            // 对响应错误做点什么
            Message({
                message: '服务器异常,请联系管理员',
                type: 'error',
                duration: 5 * 1000,
                customClass: 'messageIndex'
            })
        }
        return Promise.reject(error);
    }
)
//对错误信息的处理函数
function handleErrorData (errMes) {
    if (errMes.message) {
        Message.error(errMes.message);
    } else {
        switch (errMes.code) {
            case 401:
                Message.error("未授权,请重新登录!");
                break;
            case 403:
                Message.error("拒绝访问");
                break;
            case 404:
                Message.error("很抱歉,资源未找到!");
                break;
            case 500:
                Message.error("服务器错误!");
                break;
            default:
                Message.error("服务正在联调中,请稍后!");
                break;
        }
    }
}
export default service