Axios：如何一个接一个地运行多个请求？

Question

I have a very large array of IDs (thousands of IDs). I want to loop through this array and for each value, make a request to an API like so:

[12, 32, 657, 1, 67, ...].forEach((id) => {
    axios.get(`myapi.com/user/${id}`).then(({ data }) => {
        console.log(data.name);
    });
});

However, I have so many requests to make I can't make them asynchronous because my computer has limits... Is it possible to wait for each request to be finished before making the next one?

Answer 1

Instead of using forEach in id try Promise.all

const ids = [12, 32, 657, 1, 67];
const promises = ids.map((id) => axios.get(`myapi.com/user/${id}`));

Promise.all([...promises]).then(function (values) {
  console.log(values);
});

Let's say we want many promises to execute in parallel and wait until all of them are ready.

For instance, download several URLs in parallel and process the content once they are all done.

From https://javascript.info/promise-api

Answer 2

Firstly, it's clear you have to redesign your api.

However, you can try:

Promise.all([12, 32, 657, 1, 67, ...].map((id) => {
    return axios.get(`myapi.com/user/${id}`).then(({ data }) => {
        console.log(data.name);
    });
})).then(_=>console.log('done'));

or look into p-queue which will help you manage the queue of promises.

Answer 3

Let's assume that you allow n requests to be sent maximum at any given time. For the sake of the example I assume it's 10:

var n = 10;

We also store the current index:

var index = 0;

Let's implement a function to handle the requests:

function req() {
    axios.get(`myapi.com/user/${input[index]}`).then(({ data }) => {
        console.log(data.name);
        if (index + 1 < input.length) {
            index++;
            req();
        }
    });    
}

Then, let's send the first n requests:

while (index < n) {req(); index++}

Yes, index is global, but it is global for the sake of readability.