reactjs - How do I refresh JWT Token using Axios request interceptor for multiple parallel requests?

Question

It refreshes with Jwt token and the newly created token is assigned to the header. But when we send more than one parallel request, it creates a refresh Token for each request. How can I resolve this situation.

axios.interceptors.response.use(
      (res) => res,
      async (error) => {
        return new Promise((resolve, reject) => {
          const e = error.response || {};
          let callback = e.config || {};
          if (e.status === 401 ) {
            //refreshToken servis ile habele?iyor.
            refreshService()
              .then((refreshResponse) => {
                const newToken = refreshResponse.data.data.accessToken;
                setAccessToken(newToken);
                callback.headers["Authorization"] = `Bearer ${newToken}`;
                http(callback)
                  .then((httpResponse) => resolve(httpResponse))
                  .catch(() => {
                    ....
                  });
              })
              .catch((error) => {
                setAccessToken(null);
                setRefreshToken(null);
                ....
              });
          } else {
            setError(e.data);
            reject({});
          }
        });
      }
    );

question from:https://stackoverflow.com/questions/66053555/how-do-i-refresh-jwt-token-using-axios-request-interceptor-for-multiple-parallel

Answer 1

Waitting for answers