浏览器空白标签页使用fetch发起请求失败的技术咨询

一、空白标签页的Origin与CORS机制 #

• 空白标签页的Origin值为null（Chromium系浏览器如Chrome的表现），因为空白页没有对应的合法源（协议+域名+端口组合）。
• 发起跨域请求时，若服务器未配置允许null作为合法Origin，会直接触发CORS拦截，导致请求失败。此时浏览器只会显示临时请求头（Provisional headers are shown），因为请求未成功发送至服务器。

二、"Provisional headers are shown"的本质 #

这个提示说明浏览器未将请求成功发送到目标服务器，常见触发原因：

• CORS策略拦截：服务器拒绝null Origin的请求
• 浏览器内置安全规则阻止无源上下文的请求
• 第三方扩展程序拦截请求
  此时展示的是浏览器准备发送的请求头，而非实际抵达服务器的完整内容。

三、获取完整请求头的可行方法 #

• 使用本地代理抓包工具：Charles、Fiddler等工具可以绕过浏览器开发者工具的限制，捕获浏览器实际发出的所有请求头，包括Origin等被隐藏的字段。
• 为空白页赋予合法Origin：在控制台执行document.location = "http://localhost:8080"（任意本地服务地址），待页面跳转后，再发起请求即可在开发者工具中看到完整请求头。
• 导出浏览器网络日志：Chrome可通过chrome://net-export/导出详细网络日志，日志中包含所有请求的完整头信息。

四、空白标签页请求的核心原理 #

• 空白页属于「无源上下文」，浏览器会为其分配特殊的null Origin。
• 按照CORS规范，null Origin是高风险源，多数服务器默认不会允许此类请求，防止恶意页面利用空白页发起跨域攻击。
• 当请求因CORS被拦截时，浏览器会终止请求流程，因此开发者工具无法展示实际发送的完整请求头，仅能显示准备阶段的临时头数据。

内容的提问来源于stack exchange，提问作者Steven Steeve