Error: Interceptor not triggered

Here is my interceptor

axios.interceptors.response.use((response) => {
  return response
}, function (error) {
  // Do something with response error
  if (error.response.status === 401) {
    auth.logout()
    router.replace('/login')
  }

  return Promise.reject(error)
})

During this call which returns a 401, the interceptor is not triggered. I can catch the reject() where I called method.

axios.get('/api/employees/')
      .then(response => {
        commit('SET_EMPLOYEE_LIST', response.data)
        resolve(response)
      })
      .catch(err => reject(err))

• axios version: v0.16.2
• Environment: chrome 59, windows 10

[Alexandre-Georges]

I have had a similar issue, it seems like the axios instance is different when the interceptor is added and when a call is performed.

You also probably want to have a better handling of the 401 in the interceptor.

I found a workaround for the not triggered interceptor although it is probably a bug, I add the interceptor to the instance itself:

const instance = axios.create();
instance.interceptors.response.use((response) => {
  console.log(`response ${response}`);
  return response;
}, (error) => {
  console.log(`error ${error}`);
  return Promise.reject(error);
});

[paddelboot]

This is weird. In all the tutorials and SE answers, I see the interceptor being added to the axios instance. But this didn’t work for me at all. Instead, I had to add it to the imported axios module before calling the create() method:

import axios from 'axios';

// Redirect if API return unauthorized
axios.interceptors.response.use(function (response) {

console.log( 'interceptor' );

return response;
}, function (error) {

console.log( error );

if (401 === error.response.status) {

    window.location = '/login';

} else {
    return Promise.reject(error);
}
});

const axiosInstance = axios.create({
baseURL: `http://example.org/`,
headers: {
    'Content-Type': 'application/json'
},
withCredentials: true
});

export default axiosInstance;