1. import axios from 'axios';
    2. // cancelToken.js
    3. // 声明一个 Map 用于存储每个请求的标识 和 取消函数
    4. const pending = new Map();
    5. /**
    6.  * 添加请求
    7.  * @param {Object} config
    8.  */
    9. export const addPending = (config: any) => {
    10.   const url = [config.method, config.url].join('&');
    11.   config.cancelToken =
    12.     config.cancelToken ||
    13.     new axios.CancelToken((cancel: any) => {
    14.       if (!pending.has(url)) {
    15.         // 如果 pending 中不存在当前请求，则添加进去
    16.         pending.set(url, cancel);
    17.       }
    18.     });
    19. };
    20. /**
    21.  * 移除请求
    22.  * @param {Object} config
    23.  */
    24. export const removePending = (config: any) => {
    25.   const url = [config.method, config.url].join('&');
    26.   if (pending.has(url)) {
    27.     // 如果在 pending 中存在当前请求标识，需要取消当前请求，并且移除
    28.     const cancel = pending.get(url);
    29.     cancel(url);
    30.     pending.delete(url);
    31.   }
    32. };
    33. /**
    34.  * 清空 pending 中的请求（在路由跳转时调用）
    35.  */
    36. export const clearPending = () => {
    37.   // eslint-disable-next-line no-restricted-syntax
    38.   for (const [url, cancel] of pending) {
    39.     cancel(url);
    40.   }
    41.   pending.clear();
    42. };
    1. /* eslint-disable */
    2. import axios from 'axios';
    3. import {h} from 'vue'
    4. // import qs from 'qs';
    5. import { ElMessageBox } from 'element-plus';
    6. import globalData from './contant';
    7. import warningIcon from '@/assets/imgs/status_warning.png';
    8. import {addPending,removePending} from "./cancelToken";
    10. let showedMsgBox = false; // 默认messagebox未打开
    12. axios.defaults.withCredentials = true;
    13. // const isDemoPage = window.location.href.includes('/resource-center')
    14. // 请求拦截（配置发送请求的信息）
    15. axios.interceptors.request.use(
    16.   config => {
    17.     const {appName,versionName,versionCode, cuid, channel, version} = globalData.appInfo;
    18.     // if(isDemoPage){
    19.     //   config.headers['X-SMART-DLGIN'] = '!ab@testemo'
    20.     // }
    21.     if (
    22.       config.method === 'post' &&
    23.       config.headers['content-type'] !== 'multipart/form-data'
    24.     ) {
    25.       config.data = config.data;
    26.     }
    27.     removePending(config) // 在请求开始前，对之前的请求做检查取消操作
    28.     addPending(config) // 将当前请求添加到 pending 中
    29.     return config;
    30.   },
    31.   error => {
    32.     return Promise.reject(error);
    33.   }
    34. );
    36. const showMessageBox = (message: string, fn?: Function) => {
    37.   return (
    38.     ElMessageBox({
    39.       customClass: 'globalMsg',
    40.       showClose: false,
    41.       message: h('div',{ class: 'message-body-wrapper' }, [
    42.         h('div', { class: 'message-title'}, [
    43.           h('img', { class: 'icon', src: warningIcon }),
    44.           h('span',{ class:'title' }, '提示')
    45.         ]),
    46.         h('div', { class: 'message-content' }, message),
    47.       ]),
    48.       confirmButtonText: '确定',
    49.       closeOnClickModal: true,
    50.       callback:(action:any) =>{
    51.         fn && fn();
    52.       }
    53.     })
    54.   )
    55. }
    57. /**
    58.  * define error msg
    59.  */
    60. const msgConst = new Map([
    61.   [5002, '用户未登录'],
    62.   [5006, '密码已修改，请重新登录'],
    63.   [4000, '服务器异常, 请稍后重试'],
    64. ])
    66. // 响应拦截（配置请求回来的信息）
    67. axios.interceptors.response.use(
    68.   res => {
    69.     removePending(res) // 在请求结束后，移除本次请求
    70.     if (res.headers['content-type'] === 'text/html') {
    71.       return Promise.reject({
    72.         errMsg: "Not Found",
    73.         errNo: 404,
    74.         data: null
    75.       });
    76.     }
    77.     const resData: any = res.data;
    78.     let errCode: number | undefined = Number(resData.errNo);
    79.     if (errCode === 0) {
    80.       return Promise.resolve(resData.data);
    81.     }
    82.     if (msgConst.has(errCode) && !showedMsgBox) {
    83.       showedMsgBox = true;
    84.       showMessageBox(msgConst.get(errCode) || '系统发现未知异常', () => showedMsgBox = false);
    85.     }
    86.     return Promise.reject(resData);
    87.   },
    88.   err => {
    89.     console.log(err)
    90.     if (axios.isCancel(err)) {//处理手动cancel
    91.       console.log('这是手动cancel的')
    92.     }
    93.     return Promise.reject(err);
    94.   }
    95. );
    97. export default axios;