关于使用 Axios 发送多个请求的查询 - React

Question

有一种情况，我需要使用 Axios 一次调用多个服务，我需要考虑成功 API 调用的值并忽略失败的 API 调用。 例如，请看下面的案例：

let URL1 = "https://www.something.com"
let URL2 = "https://www.something1.com"
let URL3 = "https://www.something2.com"

const promise1 = axios.get(URL1);  // SUCCESS
const promise2 = axios.get(URL2);  // SAY THIS SERVICE CALL WAS FAILED SENDING 404 ERROR
const promise3 = axios.get(URL3);  // SUCCESS

Promise.all([promise1, promise2, promise3]).then(function(values) {
  console.log(values);
}).catch((e)=>{ console.log("error",e)});

假设服务 2 失败，而服务 1 和 3 成功，在这种情况下 promise 链被破坏并抛出错误。 在[response_1, null, response_3]这样的情况下，我需要 output。 你能指导我如何实现这一目标吗？ 提前致谢。

Answer 1

我的猜测是您应该通过在catch上返回Promise.resolve()来手动实现它。

let URL1 = "https://www.something.com"
let URL2 = "https://www.something1.com"
let URL3 = "https://www.something2.com"

const promise1 = axios.get(URL1).catch(() => Promise.resolve());  // SUCCESS
const promise2 = axios.get(URL2).catch(() => Promise.resolve());  // SAY THIS SERVICE CALL WAS FAILED SENDING 404 ERROR
const promise3 = axios.get(URL3).catch(() => Promise.resolve());  // SUCCESS

Promise.all([promise1, promise2, promise3]).then(function(values) {
  console.log(values);
}).catch((e)=>{ console.log("error",e)});

这样，如果 axios 请求失败，它将首先进入 axios.catch然后返回成功，并返回您需要的任何值。

您可以在MDN 上使用 Promises 链接找到有关Promise 链接的更多信息（例如在 catch 之后链接）。

Promise.all()将看不到任何捕获，因此请记住，这些请求将不再能够在Promise.all上失败。