How to eject manually

The documentation doesn’t say how to combine axios-auth-refresh and custom error interceptors. There is only the line “interceptor id (in case you want to eject it manually)” How to eject it manually? When i use $axios.onError (from @nuxt/axios) with createAuthRefreshInterceptor it stop working.

Code in nuxtjs plugin file:

import createAuthRefreshInterceptor from 'axios-auth-refresh';
import { Api } from '@/api/api'; // Custom api layer 

export default function({ $axios, store, isServer, res, error }, inject) {
  $axios.onError(async errorObject => {
    const code = parseInt(errorObject.response && errorObject.response.status);
    let message = '';
    if (code === 404) {
      message = 'Page not found';
    }
    if (code === 422) {
      return { error: errorObject, data: errorObject.response.data };
    }
   ... // other codes
    error({ statusCode: code, message }); 

    return { error: errorObject, data: errorObject.response.data };
  });

  const refreshAuthLogic = failedRequest =>
    store.dispatch('global/refreshToken').then(tokenRefreshResponse => {
      failedRequest.response.config.headers['Authorization'] =
        'Bearer ' + tokenRefreshResponse.token;
      return Promise.resolve();
    });

  createAuthRefreshInterceptor($axios, refreshAuthLogic);

  const api = new Api($axios); 
  inject('api', api);

}

And it doesn’t work, but if remove the onError handler it will

[Flyrell]

Well, if you emit it manually, you woudn’t really need that library. But there’s a bit more logic for it to work properly, as you need a queue for requests that has been dispatched while the token is refreshing, etc.

I think it might work if you move the createAuthRefreshInterceptor above the onError (so it gets called after your own $axios.onError interceptor and instead of returning Promise.reject({ error: errorObject, data: errorObject.response.data }) you’d return the Promise.reject(errorObject);. Can you try that?

createAuthRefreshInterceptor(/* ... */);
$axios.onError(async errorObject => {
    const code = parseInt(errorObject.response && errorObject.response.status);
    let message = '';
    if (code === 404) {
      message = 'Page not found';
    }
    if (code === 401) {
      return Promise.reject(errorObject);
    }

    error({ statusCode: code, message });

    return Promise.reject({
      error: errorObject,
      data: errorObject.response.data,
    });
  });

[Flyrell]

I’m not exactly sure what you’re trying to achieve. Would you please edit your question with a code sample?

Manual ejection should be as simple as calling the following…

const refreshAuthIterceptorId = createAuthRefreshInterceptor(/* ... */);
axios.interceptors.response.eject(refreshAuthIterceptorId);