如何结合Promise.all()、setTimeout与reduce实现API请求分批节流

完全可以通过Array.reduce()结合setTimeout来实现这种分组节流的API调用，同时最终还能像使用Promise.all()一样拿到所有请求的结果。核心思路是把用户数据分成每50个一组，然后通过reduce构建一个串行的Promise链，让每组请求之间间隔5秒执行，最后把所有组的结果合并起来。

具体实现步骤 #

1. 先对用户数组进行分组：把大量用户拆分成每50个一组的小批次，这样每次只并发处理50个请求。
2. 用reduce构建节流Promise链：通过reduce的累加器维护一个Promise，每次迭代都等待前一组请求完成（加上5秒延迟）后，再执行当前组的请求，并把结果逐步合并。
3. 最终获取所有结果：reduce返回的最终Promise会包含所有请求的结果，和直接用Promise.all()得到的结果结构完全一致。

代码示例 #

// 1. 定义一个数组分组工具函数
const chunkArray = (arr, chunkSize) => {
  const chunks = [];
  for (let i = 0; i < arr.length; i += chunkSize) {
    chunks.push(arr.slice(i, i + chunkSize));
  }
  return chunks;
};

// 2. 模拟你的API调用函数（替换成实际的接口调用）
const fetchUserDetails = async (user) => {
  const response = await fetch(`/api/users/${user.id}`);
  return response.json();
};

// 3. 主逻辑：节流处理批量请求
const processUsersWithThrottle = async (users) => {
  const chunkSize = 50;
  const delayMs = 5000;
  
  // 把用户分成每50个一组
  const userChunks = chunkArray(users, chunkSize);
  
  // 用reduce构建串行Promise链
  return userChunks.reduce((accPromise, chunk, index) => {
    return accPromise.then(prevResults => {
      // 第一组请求立即执行，后续每组等待5秒
      const delay = index === 0 ? Promise.resolve() : new Promise(resolve => setTimeout(resolve, delayMs));
      
      return delay.then(() => {
        // 并行处理当前组的50个请求
        const chunkPromises = chunk.map(user => fetchUserDetails(user));
        return Promise.all(chunkPromises).then(chunkResults => {
          // 合并之前的结果和当前组的结果
          return [...prevResults, ...chunkResults];
        });
      });
    });
  }, Promise.resolve([]));
};

// 4. 使用示例
const users = [/* 你的大量用户数据 */];
processUsersWithThrottle(users)
  .then(allResults => {
    console.log('所有用户的详细信息:', allResults);
    // 这里的allResults顺序和原users数组完全一致
  })
  .catch(error => {
    console.error('请求过程中出现错误:', error);
    // 任何一个请求失败都会触发这里，和Promise.all的行为一致
  });

关键细节说明 #

• 分组并发+组间节流：每组内部用Promise.all()并行处理50个请求，保证效率；组之间通过setTimeout延迟5秒，实现每5秒处理一批的节流要求。
• 结果顺序一致性：最终返回的allResults数组顺序和原users数组完全对应，和直接使用Promise.all(users.map(fetchUserDetails))的结果顺序一致。
• 错误处理：如果任何一个API请求失败，整个Promise链会立即reject，和Promise.all()的“快速失败”行为一致。如果需要容错（比如某个请求失败不影响整体），可以在fetchUserDetails的map里加上catch：

  const chunkPromises = chunk.map(user => fetchUserDetails(user).catch(err => ({ error: err, userId: user.id })));
  

额外提示 #

如果你的API速率限制更严格（比如不仅限每5秒50次，还限制每秒请求数），可以在每组内部再做一次细粒度的节流，但根据你的需求，上述方案已经完全满足“每5秒约50次”的要求。

内容的提问来源于stack exchange，提问作者hotshotiguana