为何跨域设置X-Requested-With头时浏览器未报错？我的预期有误吗？

咱们来拆解一下这里的关键细节：

首先，你混淆了fetch两种模式的跨域规则：

• 当使用默认的cors模式时，如果你添加了X-Requested-With这类自定义头，浏览器会先发送OPTIONS预检请求，确认服务器允许这个自定义头后才会发送实际请求；如果服务器不允许，浏览器会直接拦截请求并抛出CORS错误——这是你原本预期的行为。
• 但当你把mode设为no-cors时，规则完全变了：这个模式是专门用来发送不透明请求的，浏览器会做两件关键的事：
  1. 自动过滤掉所有不符合“简单头”要求的自定义头（也就是你设置的X-Requested-With: Foo根本没被发送出去，浏览器直接给你删了）
  2. 抑制所有CORS相关的错误提示，不会因为跨域问题阻止请求发送

所以你看到的404，和CORS完全无关——只是你请求的Google域名下的那个随机资源本身不存在，服务器返回了404状态码。而且要注意，虽然你能在开发者工具的网络面板里看到这个404，但你的JavaScript代码其实无法读取这个响应的任何内容（包括状态码、响应体），因为no-cors模式下的响应是“不透明”的，浏览器会限制脚本访问这些信息。

简单来说：no-cors模式的设计目的就是让你能发送跨域请求，但代价是无法获取响应细节，同时浏览器会自动修正请求头来符合简单请求规则，不会因为自定义头拦截请求。

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