request实现请求去重+结果共享

import axios from 'axios'
import { Notification, MessageBox, Message, Loading } from 'element-ui'
import store from '@/store'
import { getToken } from '@/utils/auth'
import errorCode from '@/utils/errorCode'
import { tansParams, blobValidate,isObjFun } from "@/utils/ruoyi";
import cache from '@/plugins/cache'
import { saveAs } from 'file-saver'

/**实现请求去重+结果共享**/

let downloadLoadingInstance;
// 是否显示重新登录
export let isRelogin = { show: false };
// 请求队列
const pendingRequests = new Map();
axios.defaults.headers['Content-Type'] = 'application/json;charset=utf-8'
// 创建axios实例
const service = axios.create({
  // axios中请求配置有baseURL选项,表示请求URL公共部分
  baseURL: process.env.VUE_APP_BASE_API,
  // 超时
  timeout: 20000
})
/**
 * 生成请求唯一标识
 */
function generateRequestKey(config) {
  const method = config.method?.toUpperCase() || 'GET';
  // 对于 GET,只取基础路径(不含查询参数)
  const url = config.url.split('?')[0];

  let paramsStr = '';
  if (method === 'GET' && config.params) {
    // 使用 config.params(此时还未被清空)
    const sortedParams = Object.keys(config.params)
      .sort()
      .reduce((obj, key) => ({ ...obj, [key]: config.params[key] }), {});
    paramsStr = JSON.stringify(sortedParams);
  }

  let dataStr = '';
  if (['POST', 'PUT', 'PATCH'].includes(method) && config.data) {
    // POST/PUT 直接使用 config.data(不会被后续逻辑修改)
      const sortedData = Object.keys(config.data)
      .sort()
      .reduce((obj, key) => ({ ...obj, [key]: config.data[key] }), {});
    dataStr = JSON.stringify(sortedData);
    config.data = JSON.stringify(config.data);
  }

  return `${method}_${url}_${paramsStr}_${dataStr}`;
}

// request拦截器
service.interceptors.request.use(config => {
   // ====== 先生成 requestKey======
  const requestKey = generateRequestKey(config);

  // 检查是否已有相同请求
  if (pendingRequests.has(requestKey)) {
    console.log(`[请求合并] 等待已有请求: ${config.url}`);
    config.adapter = () => pendingRequests.get(requestKey);
    return config;
  }
  // 是否需要设置 token
  const isToken = (config.headers || {}).isToken === false
  // 是否需要防止数据重复提交
  const isRepeatSubmit = (config.headers || {}).repeatSubmit === false
  if (getToken() && !isToken) {
    config.headers['Authorization'] = 'Bearer ' + getToken() // 让每个请求携带自定义token 请根据实际情况自行修改
  }
  isObjFun(config.params);
  isObjFun(config.data);
  // get请求映射params参数
  if (config.method === 'get' && config.params) {
    const paramsStr = tansParams(config.params);
    if (paramsStr) {
      config.url = config.url + '?' + paramsStr;
    }
    config.params = {};
  }

   // 发起真实请求
  const requestPromise = service.defaults.adapter(config)
    .finally(() => {
      setTimeout(() => {
        pendingRequests.delete(requestKey) // 请求结束后移除
      }, 20000);
    });

  pendingRequests.set(requestKey, requestPromise);
  config.adapter = () => requestPromise;
  return config
}, error => {
    console.log(error)
   return Promise.reject(error)
})

// 响应拦截器
service.interceptors.response.use(res => {
    // 未设置状态码则默认成功状态
    const code = res.data.code || 200;
    // 获取错误信息
    const msg = errorCode[code] || res.data.msg || errorCode['default']
    // 二进制数据则直接返回
    if (res.request.responseType ===  'blob' || res.request.responseType ===  'arraybuffer') {
      return res.data
    }
    if (code === 401) {
      if (!isRelogin.show) {
        isRelogin.show = true;
        MessageBox.confirm('登录状态已过期,您可以继续留在该页面,或者重新登录', '系统提示', { confirmButtonText: '重新登录', cancelButtonText: '取消', type: 'warning' }).then(() => {
          isRelogin.show = false;
          store.dispatch('LogOut').then(() => {
            location.href = '/index';
          })
      }).catch(() => {
        isRelogin.show = false;
      });
    }
      return Promise.reject('无效的会话,或者会话已过期,请重新登录。')
    } else if (code === 500) {
      Message({ message: msg, type: 'error' })
      return Promise.reject(new Error(msg))
    } else if (code === 601) {
      Message({ message: msg, type: 'warning' })
      return Promise.reject('error')
    } else if (code !== 200) {
      Notification.error({ title: msg })
      return Promise.reject('error')
    } else {
      return res.data
    }
  },
  error => {
    console.log('err' + error)
    let { message } = error;
    if (message == "Network Error") {
      message = "后端接口连接异常";
    } else if (message.includes("timeout")) {
      message = "系统接口请求超时";
    } else if (message.includes("Request failed with status code")) {
      message = "系统接口" + message.substr(message.length - 3) + "异常";
    }
    Message({ message: message, type: 'error', duration: 5 * 1000 })
    return Promise.reject(error)
  }
)

// 通用下载方法
export function download(url, params, filename, config) {
  downloadLoadingInstance = Loading.service({ text: "正在下载数据,请稍候", spinner: "el-icon-loading", background: "rgba(0, 0, 0, 0.7)", })
  return service.post(url, params, {
    transformRequest: [(params) => { return tansParams(params) }],
    headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
    responseType: 'blob',
    ...config
  }).then(async (data) => {
    const isBlob = blobValidate(data);
    if (isBlob) {
      const blob = new Blob([data])
      saveAs(blob, filename)
    } else {
      const resText = await data.text();
      const rspObj = JSON.parse(resText);
      const errMsg = errorCode[rspObj.code] || rspObj.msg || errorCode['default']
      Message.error(errMsg);
    }
    downloadLoadingInstance.close();
  }).catch((r) => {
    console.error(r)
    Message.error('下载文件出现错误,请联系管理员!')
    downloadLoadingInstance.close();
  })
}

export default service

  

posted @ 2025-11-19 10:14  dsrlii  阅读(3)  评论(0)    收藏  举报