Benny
Benny

Reputation: 879

Do not return to axios call after call has been made

I am trying to build a registration using axios and run into some issue. Is it possible in an axios call to submit data to the backend and immediately after refreshing the page to a new one, without returning back to the axios call?

Currently, I have this solution:

   axios.post('/traveller-register', this.form.data)
   .then(function(response){
     toastr.success(response.data.status);
     setTimeout(function(){
       window.location = response.data.redirect;
     }, 6000);
   })

It shows a success message after returning successfully, then redirects after a certain amount of time, but what I would like to have is when the call returns to send it to a different page directly without returning to axios, is that possible somehow?

I am using laravel as a backend, and axios / vue for frontend.

Upvotes: 0

Views: 1127

Answers (2)

Benny
Benny

Reputation: 879

For those who run into a similar issue, the solution I found now was to save the needed data into session storage of the browser after respone from axios and display the message on page redirect:

Setting message before reload:

axios.post('/register', this.form.data)
 .then(function(response){
   sessionStorage.setItem("flashmessage", response.data.status); // status message
   window.location = response.data.redirect // route for redirection
}

Getting message and displaying it on page reload once:

<script>
if (sessionStorage.flashmessage) {
  toastr.success(sessionStorage.flashmessage);
  sessionStorage.removeItem('flashmessage');
}
</script>

I used the information from here: https://www.w3schools.com/jsref/prop_win_sessionstorage.asp

Upvotes: 2

Cody Caughlan
Cody Caughlan

Reputation: 32748

No, its not possible. You need the then() function to exist to trigger the resolution of the Axios call and thus the firing off that HTTP request.

If you dont want a delay just remove the 6 second timeout delay?

Upvotes: 1

Related Questions