Estoy tratando de actualizar el token de acceso usando tokens de actualización. Estoy usando interceptores axios para llamar al punto final /refresh que devuelve un nuevo token de acceso. Estoy configurando el token y el token de actualización en el almacenamiento local. sin embargo, cuando el token caduca, se llama al método getAll antes que al interceptor de respuesta. el token se actualiza en el almacenamiento local después de llamar al punto final /refresh en el interceptor de respuesta, pero en el método getAll , el token que está configurado en el encabezado sigue siendo el token caducado anterior. Sin embargo, cuando actualizo la página, el nuevo token se establece en el encabezado y funciona como se esperaba. cuando veo la consola del servidor, muestra que se llama al punto final de /patients antes que al punto final de /refresh . Llamo al método getAll cuando se monta el componente.

codigo interceptor axios:

 import { getFromLS } from "./localStorage"; const baseURL = "http://localhost:4200/api" const instance = axios.create({ baseURL, }); instance.interceptors.request.use((request: AxiosRequestConfig) => { axios.defaults.headers.common["Authorization"] = ""; delete axios.defaults.headers.common["Authorization"]; if (getFromLS("token")) { if(request.headers) { request.headers.Authorization = getFromLS("token"); } } return request; }); instance.interceptors.response.use( (response) => response, (error) => { const originalRequest = error.config; if ( error.response.status === 401 && originalRequest.url === `${baseURL}/refresh` ) { return Promise.reject(error); } if (error.response.status === 401 && !originalRequest._retry) { originalRequest._retry = true; instance .post("/refresh", { body: { id: Number(getFromLS("user")), refreshToken: getFromLS("refreshToken"), }, }) .then((response) => { const newToken = response.data.data.newAccessToken; localStorage.setItem("token", newToken); instance.defaults.headers.common[ "Authorization" ] = `Bearer ${newToken}`; return instance(originalRequest); }) } return Promise.reject(error); } ); export default instance;

el método getAll que utiliza la instancia de axios anterior:

 get: (url: string) => instance.get<IPatientResponse>(url).then(responseBody) getAll: (): Promise<IPatientResponse[]> => get("/patients"),