Authentication 禁用AXIOS上的并发或同时HTTP请求

我们的刷新身份验证令牌流遇到了问题，如果同时使用相同的过期访问令牌发出多个请求，所有请求都将使用后端刷新令牌，并且在响应中具有不同的刷新令牌。现在，当发出下一个请求时，将使用上一个响应的刷新令牌，该令牌可能是最新的，也可能不是最新的

这个问题的一个解决方案是让UI（在vue中使用axios）一次只发送一个请求。因此，如果刷新了令牌，则以下请求将具有最新的令牌

---

因此，我想知道axios是否有一个默认选项来禁用同步请求，因为我在网上找不到任何关于它的信息。另一个解决方案是维护一个请求队列，其中每个请求仅在收到前一个请求的响应（成功或失败）时发送（手动选项）。我知道这可能会降低UI中的性能，但也会减少后端的负载。

我发现一个可能的解决方案是使用拦截器：

let isRefreshing = false;
let refreshSubscribers = [];

const instance = axios.create({
  baseURL: Config.API_URL,
});

instance.interceptors.response.use(response => {
 return response;
}, error => {
  const { config, response: { status } } = error;
  const originalRequest = config;

  if (status === 498) { //or 401
    if (!isRefreshing) {
      isRefreshing = true;
      refreshAccessToken()
        .then(newToken => {
          isRefreshing = false;
          onRrefreshed(newToken);
        });
    }

    const retryOrigReq = new Promise((resolve, reject) => {
      subscribeTokenRefresh(token => {
        // replace the expired token and retry
        originalRequest.headers['Authorization'] = 'Bearer ' + token;
        resolve(axios(originalRequest));
      });
    });
    return retryOrigReq;
  } else {
    return Promise.reject(error);
  }
});

subscribeTokenRefresh(cb) {
  refreshSubscribers.push(cb);
}

onRrefreshed(token) {
  refreshSubscribers.map(cb => cb(token));
}

---

如果它同时捕获多个请求的错误，是否会同时发送刷新请求？表示您正在多次刷新令牌，并且可能与后端不同步。这是最初的问题。它在我们的系统中的实现方式是刷新流是服务调用的一部分，而不是单独的调用。我昨天解决这个问题的方法是比较刷新令牌中的过期时间和客户端的过期时间。通过这种方式，您可以确保您正在为以下所有请求使用最新的令牌。不，上述方法的思想是调用refreshAccessToken（）一次，然后使用唯一请求的新令牌更新所有订阅者。您可以按照链接查看一些注释和分叉，但总体思路应该适用于您的情况。