Promise.all 和在异步函数中构建 axios 请求

Question

我正在循环数据以构建多个 axios 请求，并且在这个异步循环中等待一些数据。

当我这样做时，Promise.all 会在 .catch(errror => {}) 的其中一个请求引发错误之前解决，我故意提供了一个错误数据，因此请求会被捕获。

return new Promise((resolve) => {
    let requestArr = [];
    requestsData.forEach(async (data) => {
        let waitForThisData = await someFunction(data.id);
        requestArr.push(
            axios
             .post()
             .then((response) => {})
             .catch((error) => {})
        );
    });

    Promise.all(requestArr).then(() => {
        resolve(true);
    });
});

我正在用 3 个请求对此进行测试，其中 1 个将被捕获。当我添加断点时，Promise.all 在转到其中一个请求之前已经解析。

如果我删除等待代码，那么我会得到预期的输出，在Promise.all 解析之前先捕获触发器。

那么为什么 Promise.all 在其中一个请求完成之前解决（错误并去捕获）？

Answer 1

这将使您的Promise.all在循环内的catch之后解析，或者，实际上，在所有请求（成功或不成功）之后：

const axios = require('axios');

const someFunction = () => {
    return new Promise(resolve => {
        setTimeout(() => resolve('222'), 100)
    })
}

const requestsData = ['https://httpstat.us/200', 'https://httpstat.us/205', 'https://httpstat.us/306']
const requestArr = requestsData.map(async data => {
    let waitForThisData = await someFunction(data);
    return axios.post(data)
            .then(response => {})
            .catch(error => console.log(error.toString()))
});

Promise.all(requestArr).then(() => {
    console.log('resolved promise.all')
})

https://httpstat.us/306 会产生一个错误的调用。您可以尝试将其放在requestsData 数组中的任何位置。

Answer 2

据我所见，您正在异步向requestArr 推送承诺，因此如果您在数组被填充之前调用promise.all。当其中的承诺解决时，它就会解决。通过删除await，您可以快速将所有请求推送到requestArr。

所以为了回答您的问题，它已解决，因为在您的错误承诺调用 requestArr.push() 之前，requestArr 中的所有请求都已解决。

您可以尝试使用自己的 async foreach 函数来更好地做到这一点。

async function asyncForEach(array, callback) {
  for (let index = 0; index < array.length; index++) {
    await callback(array[index], index, array);
  }
}

现在您可以在拨打Promise.all() 之前先await foreach。

let requestArr = [];

await asyncForEach(requestsData, async (data) => {
    let waitForThisData = await someFunction(data.id);
    requestArr.push(
        axios
            .post()
            .then((response) => { })
            .catch((error) => { })
    );
});

Promise.all(requestArr).then(() => {
    resolve(true);
});