import axios from 'axios' import { MessageBox, Message, Loading } from 'element-ui' import store from '@/store' import { getToken } from '@/utils/auth' import { throttle } from "@/utils" import Vue from "vue" let loadingInstance; const loading = throttle(() => { loadingInstance = Loading.service({ lock:true, spinner: "el-icon-loading", background:"rgba(0,0,0,0.4)", text:"正在加载中..." }) }, 200) // create an axios instance const service = axios.create({ baseURL: process.env.VUE_APP_BASE_API, // url = base url + request url // withCredentials: true, // send cookies when cross-domain requests timeout: 20000 // request timeout }) // request interceptor service.interceptors.request.use( config => { // do something before request is sent if (config.isLoading) { loading() } const token = getToken(); if (token) { // let each request carry token // ['X-Token'] is a custom headers key // please modify it according to the actual situation config.headers['Authorization'] = `Bearer ${token}`; } return config }, error => { // do something with request error console.log(error) // for debug Vue.prototype.$nextTick().then(r => loadingInstance?.close()) return Promise.reject(error) } ) // response interceptor service.interceptors.response.use( /** * If you want to get http information such as headers or status * Please return response => response */ /** * Determine the request status by custom code * Here is just an example * You can also judge the status by HTTP Status Code */ response => { loadingInstance?.close() if (response.status !== 200) { return Promise.reject("系统错误") } const res = response.data // if the custom code is not 20000, it is judged as an error. if (res.code !== 0) { Message({ message: res.msg || '系统错误', type: 'error', duration: 5 * 1000 }) // 50008: Illegal token; 50012: Other clients logged in; 50014: Token expired; if (res.code === 20001) { // to re-login MessageBox.alert('您的登录状态已过期,需重新登录', '登录已过期', { confirmButtonText: '确定', type: 'warning', closeOnClickModal: false, showClose: false }).then(() => { store.dispatch('user/resetToken').then(() => { location.reload() }) }) } return Promise.reject(new Error(res.msg || 'Error')) } else { return res.data } }, error => { loadingInstance?.close() console.error('err' + error) // for debug Message({ message: /Network Error/g.test(error) ? "网络错误" : "系统错误", type: 'error', duration: 5 * 1000 }) return Promise.reject(error) } ) export default service