import axios from 'axios'; import type { AxiosRequestConfig, AxiosResponse } from 'axios'; import { Message, Modal } from '@arco-design/web-vue'; import { useUserStore } from '@/store'; import { getAuthorization, getToken, setAuthorization } from "@/utils/auth"; export interface HttpResponse { status: number; msg: string; code: number; data: T; } if (import.meta.env.VITE_API_BASE_URL) { axios.defaults.baseURL = import.meta.env.VITE_API_BASE_URL; } axios.interceptors.request.use( (config: AxiosRequestConfig) => { // let each request carry token // this example using the JWT token // Authorization is a custom headers key // please modify it according to the actual situation // const token = getToken(); // if (token) { // if (!config.headers) { // config.headers = {}; // } // config.headers.Authorization = `Bearer ${token}`; // } const authorization = getAuthorization(); if (authorization) { if (!config.headers) { config.headers = {}; } config.headers.Authorization = authorization; config.headers.token = getToken(); } return config; }, (error) => { // do something return Promise.reject(error); } ); // add response interceptors axios.interceptors.response.use( (response: AxiosResponse) => { const res = response.data; // if the custom code is not 20000, it is judged as an error. if ((res.retcode && res.retcode !== 0) || (res.code && res.code !== 20000)) { Message.error({ content: res.msg || 'Error', duration: 5 * 1000, }); // 50008: Illegal token; 50012: Other clients logged in; 50014: Token expired; if ( [50008, 50012, 50014].includes(res.code) && response.config.url !== '/api/user/info' ) { Modal.error({ title: 'Confirm logout', content: 'You have been logged out, you can cancel to stay on this page, or log in again', okText: 'Re-Login', async onOk() { const userStore = useUserStore(); await userStore.logout(); window.location.reload(); }, }); } return Promise.reject(new Error(res.msg || 'Error')); } if(response.config.url === '/v1/user/login') { setAuthorization(response.headers.authorization); } return res; }, (error) => { Message.error({ content: error.msg || 'Request Error', duration: 5 * 1000, }); return Promise.reject(error); } );