处理API请求并行问题-JZTXT

背景: 我们有一个导出全部数据的功能, 因为各种原因, 可能需要同时发送10几条请求来获取数据

遇到的问题: 因为浏览器http/1.1最多同时进行6个请求, 所以会阻塞用户的其他操作

打个比喻:

之前我们是一个赛道, 可以上6个任意国家的运动员, 第七个人想上去就得排队

现在改为了两个赛道:

赛道一可以同时上场4个任意国家的运动员, 但是优先加拿大的运动员
赛道二可以同时上场2个除了加拿大以外的运动员

这样就完美解决了请求并行的问题

import Throat from 'throat';

// 一次只会请求4个
const throat = Throat(4);

const functionA = () => {      
     const fetchPromises = [];
     const results = [];
      
      for (let i = 0; i < n; i++) {
        const fetchPromise = throat(async () => {
          const result = await fetch(//...);

          results.push(result);
        });

        fetchPromises.push(fetchPromise);
      }


   await Promise.allSettled(fetchPromises);
  
   results.forEach((item) => {
     // ...
   });