javascript - 为什么 XMLHttpRequest 包含 Origin header ？

Question

我想更好地理解这一点。我目前使用的心智模型是这样的:

托管在 foo.com 的 JS 希望访问托管在 bar.com 的资源。这不是浏览器喜欢向用户展示的那种东西，除非可以表明 bar.com 对此请求表示欢迎。

所以 foo.com JS 本质上将请求分成两半。首先，我们通过 XMLHttpRequest 对象发送适当类型的无数据请求(GET、POST 等)。 bar.com 上的服务器返回它通常对基本上任何请求的响应，这些请求可能包含也可能不包含 Access-Control-Allow-Origin header 。 (编辑:这是一个误解 - 请参阅下面 apsillers 的出色评论)

如果浏览器确实得到了这样的标题，它会扫描它的 Origin(在本例中为 foo.com)。如果存在，它继续发送它被要求发送的实际请求。如果没有，它会拒绝。 (编辑:这也不太正确)

如果这个模型是正确的，我很困惑为什么浏览器会发送一个带有这个初步请求的 Origin header 。检查匹配不是发生在客户端吗？发送此 header 有什么作用？

Answer 1

是这样的CORS works .这基本上是一个握手，表示欢迎您与我交谈。除非联系第 3 方，否则您无法知道是否有可能。

以下是 MDN article 的 Preflighted_requests 部分的部分内容:

Unlike simple requests (discussed above), "preflighted" requests first send an HTTP OPTIONS request header to the resource on the other domain, in order to determine whether the actual request is safe to send. Cross-site requests are preflighted like this since they may have implications to user data. In particular, a request is preflighted if:

It uses methods other than GET or POST. Also, if POST is used to send request data with a Content-Type other than application/x-www-form-urlencoded, multipart/form-data, or text/plain, e.g. if the POST request sends an XML payload to the server using application/xml or text/xml, then the request is preflighted. It sets custom headers in the request (e.g. the request uses a header such as X-PINGOTHER)