spotty-amberS
Refine•3y ago•
17 replies
spotty-amber

while using POST, PUT, or PATCH if my access token has been expired user will be logged out

I have used axios as my HTTP client and using axios-auth-refresh for refreshing my access token from a server. Everything is working fine except when my access token is expired and if I send any of the above mentioned request then the user will be logged out from the system and redirected to the login page instead of refreshing the access token and retrying the request again. My code for instantiating axiosInstance is as below:

import {
  API_BASE_URL, API_KEY, TOKEN_KEY, TOKEN_REFRESH_KEY, USER_DETAILS_KEY
} from "config";

function getAuthToken(token = localStorage.getItem(TOKEN_KEY)) {
  return `Bearer ${token}`;
}

export const axiosInstance: AxiosInstance = axios.create();

axiosInstance.interceptors.request.use(
  (request: AxiosRequestConfig) => {
      if (request.headers) {
          request.headers["x-api-key"] = API_KEY;
      } else {
          request.headers = { "x-api-key": API_KEY };
      }
      return request;
  },
);

const refreshAuthLogic = async (failedRequest: AxiosError) => {
  const refreshToken = localStorage.getItem(TOKEN_REFRESH_KEY);
  if (refreshToken) {
    try {
      const { data } = await axios
      .post(`${API_BASE_URL}/token/refresh/`, {
        refresh: refreshToken,
      });
      const { access, refresh } = data;
      // save token to storage
      axiosInstance.defaults.headers.common["Authorization"] = getAuthToken(access);
      return Promise.resolve();
    } catch {
      // remove token from storage
      return Promise.reject(failedRequest);
    }
  }
  // remove token from storage
  return Promise.reject(failedRequest);
};

createAuthRefreshInterceptor(
  axiosInstance,
  refreshAuthLogic,
  {
    pauseInstanceWhileRefreshing: true,
  }
);


and in my App.ts I am using this axiosInstance in Refine config as
<Refine
  dataProvider={restDataProvider(API_BASE_URL, axiosInstance)}
  // other configs
/>
Was this page helpful?