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 commented Jul 3, 2018

Where should I place this code?

@notimetocode

This comment has been minimized.

Copy link

notimetocode commented Jul 7, 2018

Great solution!

@sameeramrutia

This comment has been minimized.

Copy link

sameeramrutia commented Jul 11, 2018

Where should I place this code?

@sagar-gavhane

This comment has been minimized.

Copy link

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 commented Aug 8, 2018

Thanks great work!

@m4ss1m0g

This comment has been minimized.

Copy link

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 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 commented Nov 3, 2018

Thanks for this! worked smoothly

@hrb-suzuki

This comment has been minimized.

Copy link

hrb-suzuki commented Mar 16, 2019

thanks:)
It was very helpful.

@juancarloselorriaga

This comment has been minimized.

Copy link

juancarloselorriaga commented Nov 12, 2019

Thank you very much :)

@estani

This comment has been minimized.

Copy link

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 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 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 commented Feb 6, 2020

Thanks! 😁 🎉

@Flyrell

This comment has been minimized.

Copy link

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 commented Feb 12, 2020

bro awesome

@MiloszKowalski

This comment has been minimized.

Copy link

MiloszKowalski commented Feb 13, 2020

Thank you so much! 😁

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.