使用 Fetch API 时捕获个别错误答案

【问题标题】：Catching individual errors when using Fetch API使用 Fetch API 时捕获个别错误
【发布时间】：2021-08-07 21:35:18
【问题描述】：

我正在尝试一次进行多个 fetch 调用，到目前为止，我已经使用 this 页面达到了可以正确进行多个调用的地步。但是，现在的问题是，如果其中一个调用返回错误。我想要的是，如果一个 URL 是好的，一个是坏的，好的 URL 仍然返回 JSON 对象，但是坏的 URL 会返回错误。但是 catch 语句注意到一个错误并停止两个调用。

我当前的代码：

let resList = await Promise.all([
    fetch(goodURL),
    fetch(badURL)
]).then(responses => {
    return Promise.all(responses.map(response => {
        return response.json();
    }))
}).catch(error => {
    console.log(error);
});

console.log(resList);

目前，当我希望它从正确的 URL 返回 JSON 对象时，记录 resList 返回 undefined

【问题讨论】：

你能在你的代码运行的地方使用.allSettled吗（browser，Node）？
@jonrsharpe 它在 Node.js 中运行。我会试一试，干杯
@jonrsharpe 我已经尝试过.allSettled，但由于某种原因，我现在得到一个response.json 不是函数错误。不确定为什么更改承诺会对此产生影响？

标签： javascript async-await promise fetch

【解决方案1】：

正如@jonrsharpe 所说，.allSettled() 可能是你最好的选择。

你基本上也可以用这样的东西制作你自己的版本：

const results = await Promise.all(
  [a, b, c].map(p => 
    p.catch(err => { 
      /* do something with it if you want */ 
    }
  )
);

基本上，不是在Promise.all() 上设置一个catch，而是在给Promise.all() 之前给每个Promise 附加一个catch。如果其中一个抛出错误，它将触发其单独的捕获，您可以对其进行任何操作。只要你不返回别的东西，你最终会返回undefined，你可以过滤掉。

例如，如果 a 和 c 正常工作而 b 出错，您的 results 将如下所示：

['a', undefined, 'b']

而且它的顺序与你输入承诺的顺序相同，所以你可以知道哪个是失败的。

const a = new Promise((resolve) => setTimeout(() => resolve('a'), 100));
const b = new Promise((_, reject) => setTimeout(() => reject('b'), 200));
const c = new Promise((resolve) => setTimeout(() => resolve('c'), 50));

(async () => {
  const results = await Promise.all(
    [a, b, c].map(p => 
      p.catch(err => console.error('err', err))
    )
  );

  console.log(results);
})();

【讨论】：