使用Fetch API时捕获单个错误

Question

我试图同时进行多个fetch调用，到目前为止，我已经使用此页面达到了可以正确进行多个调用的程度。然而，现在的问题是，如果其中一个调用返回错误。我想要的是，如果一个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);

目前，当我希望日志resList从好的URL 返回JSON对象时，它会返回undefined

Answer 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附加一个cath。如果其中一个投错了球，它会触发它的个人接球，你可以用它做任何事情。只要你不返回其他东西，你最终会返回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);
})();