Fetch请求返回302无响应，XMLHttpRequest却正常，原因何在？

这问题大概率是**Fetch默认不携带凭证（Cookie）**的特性导致的，和XHR的默认行为差异是核心原因！

具体原因 #

XHR在同域请求时，默认会自动携带当前域名下的Cookie；但Fetch API的默认配置是credentials: 'omit'——也就是不会发送任何Cookie信息。如果你的服务器需要验证会话Cookie（比如用户登录态、权限校验），那么Fetch请求因为没带Cookie，会被服务器判定为未授权，返回302重定向到登录页或其他校验页面；而XHR和浏览器直接请求都自动带了Cookie，所以能正常拿到200状态码和JSON数据。

至于本地环境两种代码都正常，大概率是因为本地服务器没有做严格的权限校验，或者你已经在浏览器里保持了登录状态，Cookie已经存在且服务器没有强制校验导致的。

修复代码 #

只需要给Fetch请求加上凭证配置即可：

return fetch("computerssuck?" + qs, {
  credentials: 'same-origin' // 同域场景用这个，会携带当前域名的Cookie
  // 如果是跨域请求，改成 credentials: 'include'
})
.then(res => {
  // 建议先检查响应状态，避免重定向后的异常数据
  if (!res.ok) {
    throw new Error(`HTTP error! Status: ${res.status}`);
  }
  return res.json();
})
.then(data => {
  // 你的业务处理逻辑
})
.catch(err => console.log(err));

额外排查点（小概率情况） #

如果加了凭证还是不行，可以检查服务器是否对请求头有特殊要求：XHR会自动带上X-Requested-With: XMLHttpRequest头，而Fetch默认不会。可以尝试给Fetch手动添加这个请求头：

return fetch("computerssuck?" + qs, {
  credentials: 'same-origin',
  headers: {
    'X-Requested-With': 'XMLHttpRequest'
  }
})
// 后续逻辑同上

内容的提问来源于stack exchange，提问作者Ian Warburton