一次下载两个 URL，但一个完成后立即处理

Question

我有两个API网址要点击。一个已知的快速(~50-100ms(。一个已知很慢(~1s(。我使用这些结果向用户显示产品选择。目前我正在等待下载一个，然后做第二个。非常同步，因此它为已经很慢的第二次命中增加了 50-100 毫秒。

我想：

• 一次发送两个请求
• 一个请求返回后立即开始处理数据
• 等待这两个请求，然后再从那里继续。

我已经看到了Axios给出的例子...

axios.all([getUserAccount(), getUserPermissions()])
  .then(axios.spread(function (acct, perms) {
    // Both requests are now complete
  }));

但这似乎等待两个 URL 提交。这仍然会稍微快一点，但我希望我的 50ms API 命中的数据在准备就绪后立即开始显示。

Answer 1

当然，

您可以将额外的.then链接到 axios 返回的承诺：

  Promise.all([
    getUserAccount()
      .then(processAccount),
    getUserPermissions()
      .then(processPermissions)
  ]).then(([userAccount, permissions]) => {
     //...
  });

wereas processAccount 和 processPermissions 是将 axios 响应对象作为参数并返回所需结果的函数。

当然，您还可以为同一个承诺添加多个.then：

  const account = getUserAccount();
  const permissions = getUserPermissions();
  // Show permissions when ready
  permissions.then(processPermissions);
  Promise.all([account, permissions])
  .then(([account, permissions]) => {
     // Do stuff when both are ready
  });

---

我用 Promise.all 替换了axios.all - 我不知道为什么 axios 提供该助手，因为 JS 为此提供了本机实现。我尝试查阅文档...但他们甚至没有记录该 API。