Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Axios 401 response interceptor.
// Add a 401 response interceptor
window.axios.interceptors.response.use(function (response) {
return response;
}, function (error) {
if (401 === error.response.status) {
swal({
title: "Session Expired",
text: "Your session has expired. Would you like to be redirected to the login page?",
type: "warning",
showCancelButton: true,
confirmButtonColor: "#DD6B55",
confirmButtonText: "Yes",
closeOnConfirm: false
}, function(){
window.location = '/login';
});
} else {
return Promise.reject(error);
}
});
@behnamazimi

This comment has been minimized.

Copy link

@behnamazimi behnamazimi commented Jul 3, 2018

Where should I place this code?

@notimetocode

This comment has been minimized.

Copy link

@notimetocode notimetocode commented Jul 7, 2018

Great solution!

@sameeramrutia

This comment has been minimized.

Copy link

@sameeramrutia sameeramrutia commented Jul 11, 2018

Where should I place this code?

@sagar-gavhane

This comment has been minimized.

Copy link

@sagar-gavhane sagar-gavhane commented Jul 13, 2018

Use above snippets inside index.js file (entry point) or at axios configuration file. Ref: https://github.com/axios/axios#interceptors

@HogansJoe

This comment has been minimized.

Copy link

@HogansJoe HogansJoe commented Aug 8, 2018

Thanks great work!

@m4ss1m0g

This comment has been minimized.

Copy link

@m4ss1m0g m4ss1m0g commented Aug 21, 2018

In case of redirect to login page you do not fulfill the promise.
You must return Promise.reject(error); after window.location

@behnamazimi

This comment has been minimized.

Copy link

@behnamazimi behnamazimi commented Oct 9, 2018

What about the server side rendering?
Is there any solution for that?

@LaravDev

This comment has been minimized.

Copy link

@LaravDev LaravDev commented Nov 3, 2018

Thanks for this! worked smoothly

@hrb-suzuki

This comment has been minimized.

Copy link

@hrb-suzuki hrb-suzuki commented Mar 16, 2019

thanks:)
It was very helpful.

@juancarloselorriaga

This comment has been minimized.

Copy link

@juancarloselorriaga juancarloselorriaga commented Nov 12, 2019

Thank you very much :)

@estani

This comment has been minimized.

Copy link

@estani estani commented Dec 10, 2019

I can't seem to get it to work, I get a "Network Error" without any response... I see I get a 401 in the browser network panel. Any Idea? Did this change?
Answer: It was a problem with CORS and how it was setup, so axios never got the information back from the browser. This should work as is

@Avto9711

This comment has been minimized.

Copy link

@Avto9711 Avto9711 commented Jan 14, 2020

I can't seem to get it to work, I get a "Network Error" without any response... I see I get a 401 in the browser network panel. Any Idea? Did this change?
Answer: It was a problem with CORS and how it was setup, so axios never got the information back from the browser. This should work as is

Can you explain what you did or how you solved?

@estani

This comment has been minimized.

Copy link

@estani estani commented Jan 14, 2020

Nothing on the client side, this is a server side issue.

In my particular case (node.js - express) was the order of the filter, the CORS filter (dev environment) was added after the handler for this particular request, so the server wasn't sending the proper headers and thus the browser wasn't allowing the request to take place (there was no call to the server whatsoever).

@Avto9711 if you have a similar problem, you'll see it in the browser console. And it means you are trying to access a different URL over ajax, and that URL does not allow for that kind of interaction.

@simonardejr

This comment has been minimized.

Copy link

@simonardejr simonardejr commented Feb 6, 2020

Thanks! 😁 🎉

@Flyrell

This comment has been minimized.

Copy link

@Flyrell Flyrell commented Feb 7, 2020

Hey, I created the library for intercepting authentication called axios-auth-refresh. It deals with many edge cases, prevents loops, etc.
If you have some time, please, give it a try.

@sherin80

This comment has been minimized.

Copy link

@sherin80 sherin80 commented Feb 12, 2020

bro awesome

@MiloszKowalski

This comment has been minimized.

Copy link

@MiloszKowalski MiloszKowalski commented Feb 13, 2020

Thank you so much! 😁

@ashish9342

This comment has been minimized.

Copy link

@ashish9342 ashish9342 commented Feb 18, 2020

Error object:

Screenshot 2020-02-17 at 4 39 40 PM

@aranne

This comment has been minimized.

Copy link

@aranne aranne commented Aug 9, 2020

Great Job!!!

@lfernandogunther

This comment has been minimized.

Copy link

@lfernandogunther lfernandogunther commented Aug 21, 2020

Nice, I'll try it. Thank you

@AbimaelAndrade

This comment has been minimized.

Copy link

@AbimaelAndrade AbimaelAndrade commented Aug 22, 2020

good job!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.