AXIOS 请求期间 XSRF-TOKEN 不匹配

Question

每当我每秒请求服务器 2-3 次时，axios 请求都会使用不同的 X-XSRF-TOKEN 标头，而不是使用 cookie。

let axiosInst = axios.create({
        baseUrl: "MY_BASE_URL_HERE",
        timeout: 20000
      });
function placeRequest() {
  if (data) {
    if (axiosInst) {
      axiosInst
        .post("MY_API_HERE", CryptojsEncrypt(data))
        .then((res) => {
          console.log("success");
        })
        .catch((err) => {
          console.log('error');
        });
    }
  }
}

请帮助我，我只想每次都发送具有相同 cookie 值和相同标头的请求，

我尝试设置拦截器和transformRequest，以便它们可以将标头与cookie进行比较，如果它们不匹配，则当时应该中止请求，但这对我不起作用。 我只是希望我的请求具有相同的标头和相同的 cookie 值。

Answer 1

这很可能是因为这些请求的并行性质。

发生的情况是，当您在收到前一个请求的响应之前启动请求时，这意味着第二个请求无法访问第一个响应中的新 cookie。

因此，它会发送服务器认为过时的令牌，但这只是因为您的 CSRF 策略错误（继续阅读）。

当您发送间隔更远的请求时，每个请求都有时间在另一个请求启动之前返回，这意味着它们实际上是按顺序发生的，并且令牌按预期来回传递。

这里的问题实际上是你的服务器端 CSRF 方法。您不需要发送新的 CSRF 令牌来响应每个 XHR/fetch 请求！实际上，您只需要在访问 HTML page 时（非 xhr 请求）提供新的 CSRF 即可。您的 API 端点甚至不应该尝试设置新的 CSRF。但是，他们仍然需要在请求整个页面时在用户会话中设置 CSRF。但除非用户在浏览器中进行硬刷新，否则这可以在后续 XHR/fetch 请求之间保持不变。