多次调用 Axios.all 来自具有多个链接的数组的请求

Question

data1 is an array with 5 links from the below loop.

let data1 = [];
console.log(data1);

for (let Items of ItemsArray) {
  const row = {
    PricingSummary: Items.pricingOptionsSummaryUrl,
  }
  data1.push(row);
  };

I want to use this array to perform 5 times GET requests by using Axios.all .
After getting the response, I want to setState to map with the data I want.

const callprice = () => { //assign a variable for a call function
    Axios.all(data1.map(l => Axios.get(l)))
    .then(Axios.spread(function(...res) {
      // setStats(....)
      console.log(res); // Getting error message : xhr.js:210 GET http://localhost:3000/[object%20Object] 404 (Not Found)
    }));
};

I'm getting the localhost 404 (Not Found) errors. Believe the request array links are incorrect from the data1 , but not sure how to make them correct.

Example of the console for the data1 :

0: {PricingSummary: 'http://snapshot.dellsvc/snapshots/MXL5hLvzBkajQ-fqGTo9oA'}
1: {PricingSummary: 'http://snapshot.dellsvc/snapshots/3gmDYxoCg0m9YgWB3aLLpA'}
2: {PricingSummary: 'http://snapshot.dellsvc/snapshots/dEpCHAi3IUe1sTIqEo9Idw'}
3: {PricingSummary: 'http://snapshot.dellsvc/snapshots/SAIS_lcIxU202-Mnm5KLIQ'}
4: {PricingSummary: 'http://snapshot.dellsvc/snapshots/H_9txy3Ejkm-zoe49Hbkzg'}
5: {PricingSummary: undefined}

Answer 1

First, axios.all() and axios.spread() are both deprecated . You should use Promise.all() or Promise.allSettled() instead.

Second, it seems at least one of your URLs is undefined which definitely won't work in a request. You may want to filter out these problem records.

Third, you're pushing objects with a PricingSummary property into data1 . These cannot be used in axios.get() since it expects a URL string , not an object. This is where your [object%20Object] is coming from.

const callprice = async () => {
  const responses = await Promise.all(
    ItemsArray
      .filter(item => item.pricingOptionsSummaryUrl) // remove falsy values
      .map(async (item) => (await axios.get(item.pricingOptionsSummaryUrl)).data) 
  )

  // now `responses` is an array of the response data
}

Answer 2

You shoud use Promise.allSettled instead