0

I am building an application in which, I am sending 3 axios calls concurrently from frontend to the backend by using axios.all function that make changes in a MONGO DB database. But the problem is, I want to send these axios requests in such a way that either all the 3 requests are made successfully, or if any 1 of the 3 fails, no other request call should be made. How can I do so in javascript?

let one = "request link 1";
let two = "request link 2";
let three = "request link 3";

const requestOne = axios.post(one, newInventory);
const requestTwo = axios.post(two, element);

const requestThree = axios.post(three, newObj);
axios.all([requestOne,requestTwo,requestThree]).then(axios.spread((...response)=>{
    alert("changes are made successfully");
    window.location.reload();
})).catch(err=>{
    alert("Some error has occured", err);
})

Here is the code. I am making 3 requests (requestOne, requestTwo, requestThree). Lets consider a case when the requestOne fails dues to some reason, while requestTwo and requestThree are successful. This is what I want to prevent. If any of the request fails, I want to revert the changes made by all the other successful requests. I want either all the requests to be successful, or all the requests to fail.

  • share your code, what you have done so far. No one would be able to help just by reading the problem statement – umair.ashfr Jan 09 '23 at 10:27
  • 1
    Share your code please – Johan Jan 09 '23 at 10:27
  • Added the code as well – Saksham Arya Jan 09 '23 at 10:53
  • 2
    https://stackoverflow.com/questions/52669596/promise-all-with-axios Does this answer your question? In the accepted answer it is commented that if one fails all fail. I think this is what you're looking for. – Juljo Shahini Jan 09 '23 at 10:58
  • Just checked, its not working. I have forcefully returned error from one of the two requests. I got the alert that there is some error but the I can see that one of the request is successful while the other failed. – Saksham Arya Jan 10 '23 at 11:32

1 Answers1

0

axios.all and axios.spread are deprecated, and this is mentioned on their GitHub page as well. Here's the link: https://github.com/axios/axios#concurrency-deprecated. So, since it's deprecated, use Promise.all instead. Below is your code with Promise.all implemented

let one = "request link 1";
let two = "request link 2";
let three = "request link 3";

const requestOne = axios.post(one, newInventory);
const requestTwo = axios.post(two, element);
const requestThree = axios.post(three, newObj);

Promise.all([requestOne,requestTwo,requestThree]).then((res)=>{
    alert("changes are made successfully");
    window.location.reload();
})).catch(err=>{
    alert("Some error has occured", err);
})

Only an error will be returned if any of the promises get rejected otherwise it will return the responses of all promises. However, a rejection of any of the promises will not make other promises' request to stop, as the request fires concurrently in Promise.all.

Daniyal Malik
  • 578
  • 2
  • 6
  • 15
  • Just checked, its not working. I have forcefully returned error from one of the two requests. I got the alert that there is some error but the I can see that one of the request is successful while the other failed. – Saksham Arya Jan 10 '23 at 11:32
  • @SakshamArya Adding your actual code can help me trace the issue. – Daniyal Malik Jan 10 '23 at 11:43