网络-合并请求

当网站上出现大量重复请求的时候应该把重复请求进行合并成一个请求
封装hooks

const promiseMap = new Map();
export async function merge(key: any, requestFn: any, ...args: any[]) {
  console.log(promiseMap);
  //动态生成key
  let cacheKey =
    args.length > 0 ? JSON.stringify(`${key}-${args.join("-")}`) : key;

  // 如果已经有相同的请求正在进行,直接返回该请求的 Promise
  if (promiseMap.has(cacheKey)) {
    return promiseMap.get(cacheKey);
  }

  try {
    // 发起请求并将 Promise 存入 Map
    const promise = args.length > 0 ? requestFn(...args) : requestFn();
    promiseMap.set(cacheKey, promise);

    // 等待请求完成
    const res = await promise;

    // 请求完成后,将结果存入 Map
    promiseMap.set(cacheKey, res.data);

    // 返回结果
    return res.data;
  } catch (error) {
    // 如果请求失败,从 Map 中移除该 key
    promiseMap.delete(cacheKey);
    throw error; // 抛出错误
  }
}

组件使用

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值