javascript - 为什么提取请求会导致服务器返回 403 而 XMLHttpRequest 不会？

Question

我使用以下代码让 XMLHttpRequest 从服务器获取 json 值:

let xhr = new XMLHttpRequest();
xhr.onreadystatechange = function () {
  if (xhr.readyState === 4 && xhr.status === 200) {
    let msg = JSON.parse(xhr.responseText);
    // Send the request to our POST Servlet
  }
};

xhr.open("GET", "/libs/granite/csrf/token.json", true);
xhr.send();

然而，我想在我的代码中使用 fetch，然而，在尝试下面的代码时，我立即得到了 403 错误的答复:

fetch("/libs/granite/csrf/token.json", { method: "GET" })
.then((response: any) => {
  if (response.status === 200 || response.statusText === "OK") {
    callback(ResponseCode.SUCCESS);
  } else {
    callback(ResponseCode.ERROR);
  }
})
.catch((error: any) => {
  callback(ResponseCode.ERROR);
});

我想知道两者之间的区别以及我应该修改什么才能使 fetch 正常工作。

Answer 1

如果服务器端存在凭据验证，那么它可能会失败，因为 fetch 不会发送或接收 cookie。你必须做 -

credentials:'include'

根据 Fetch 上的 mozilla 文档，在您的获​​取请求中

By default, fetch won't send or receive any cookies from the server, resulting in unauthenticated requests if the site relies on maintaining a user session (to send cookies, the credentials header must be sent).

https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch