Axios queued requests use stale access token from cookies after token refresh

Discussions
, ,
1

Problem

Updated cookie values are not retrieved within the same execution context, causing queued requests to fail.

Current Behavior

  1. At first, the accessToken fails.
  2. The call for refreshToken triggers, and in its response, we get the new accessToken and refreshToken.
  3. The original request triggers again with the new accessToken and succeeds.
  4. But the remaining requests in the queue, when they initiate, use the old token and fail with 401.
  5. Again, the call for refresh triggers and fails with 400.

In my Axios setup, I am injecting the accessToken from cookies. I think from there, the queued requests use the old token.

6

How are you injecting the cookie? Can you add it in a request interceptor instead so it resolves at request time instead of ahead of time?

1 Like
7

async function processQueue(newAccessToken?: string, error?: any) {

while (requestQueue.length) {

const queued = requestQueue.shift();

if (!queued) continue;



if (error) {

  queued.reject(error);

} else {

  try {

    // Explicitly set the new token on the queued request config

    // instead of relying on the interceptor (which reads stale cookies)

    if (newAccessToken) {

      queued.config.headers = {

        ...queued.config.headers,

        Authorization: \`Bearer ${newAccessToken}\`,

      };

    }

    const response = await http(queued.config);

    queued.resolve(response);

  } catch (err) {

    queued.reject(err);

  }

}

}

}

try {

      const newAccessToken = await handleTokenRefresh();



      // process all queued requests with the new token

      await processQueue(newAccessToken);



      // retry the original request with the new token explicitly

      originalRequest!.headers.Authorization = \`Bearer ${newAccessToken}\`;

      const retryResponse = await http(originalRequest!);

      response.data = retryResponse.data.Output;

      response.messages = \["Your request was processed successfully."\];

    } finally {

      isRefreshing = false;

    }

im injecting the cookies, in interceptor itself