为啥 fetch 返回 status = 0 的响应？

Posted 2023-02-22

【中文标题】为啥 fetch 返回 status = 0 的响应？

【英文标题】：Why fetch return a response with status = 0?为什么 fetch 返回 status = 0 的响应？

【发布时间】：2017-03-04 03:03:31

【问题描述】：

我想使用 fetch API 从 URL 获取整个 html 文档。

let config = 
method: 'GET',
headers: 
    'Content-Type': 'application/json',
    'Accept': 'text/html',
    'Accept-Language': 'zh-CN',
    'Cache-Control': 'no-cache'
,
mode: 'no-cors';

fetch('http://www.baidu.com', config).then((res)=> 
console.log(res);).then((text)=> );

当我在 chrome 中运行代码时，它会触发一个请求并在 chrome 网络选项卡中返回 html。但 fetch res 返回：

为什么状态为 0，我怎样才能获得像 chrome 网络中的那样正确的 res ？

【问题讨论】：

状态 0 依赖于库，fetch 函数来自哪个库？

fetch 是本机函数（现在）。

【参考方案1】：

在config.mode 的no-cors 部分：

no-cors — 防止方法成为 HEAD、GET 或 POST 以外的任何方法。如果任何 ServiceWorkers 拦截了这些请求，他们可能不会添加或覆盖除这些之外的任何标头。此外，javascript 可能不会访问结果响应的任何属性。这可确保 ServiceWorker 不会影响 Web 的语义，并防止因跨域泄露数据而引起的安全和隐私问题。

实际上，您从发出此类请求（将no-cors 指定为模式）得到的响应将不包含有关请求是成功还是失败的信息，从而使状态码为0。从您的@987654327 中删除mode @call 将显示 CORS 实际上失败了。

要了解 0 在您的特定情况下的含义，请查阅其他 SO 答案。

【讨论】：

谢谢，如果我删除“no-cors”：对预检请求的响应未通过访问控制检查：请求的资源上不存在“Access-Control-Allow-Origin”标头。因此，Origin 'localhost:8888' 不允许访问。如果不透明的响应满足您的需求，请将请求的模式设置为“no-cors”以获取禁用 CORS 的资源。如何解决 CORS？

没错。 CORS 是一项浏览器安全功能，无法从页面本身禁用。如果您想通过浏览器请求他们的页面，您必须联系 baidu.com。

欢迎来到疯狂而美妙的 CORS 世界。一个必要的（？）邪恶； CORS 对 Web 开发人员来说是一个巨大的痛苦。