CORS：为什么我的浏览器不发送 OPTIONS 预检请求？

Question

从我读到的关于CORS 的内容，我知道它应该如下工作：

1. 客户端的脚本尝试从具有不同来源的服务器获取资源。
2. 浏览器拦截此请求并首先向同一 URL 发出 preflight OPTIONS 请求。
3. 如果对这个预检请求的响应包含适当的标头（例如Access-Control-Allow-Origin: *），浏览器就会知道它可以发送主请求并执行它。
4. 响应返回到客户端脚本。

我已经为它设置了一个这样的测试：

• Go 中的服务器同时接受 - GET 和 OPTIONS 请求（使用 CURL 检查） - 并在响应中设置 Access-Control-* 标头

• 简单的 HTML 页面（由另一个端口上的另一个服务器提供服务），其中包含以下脚本（$ 代表 jQuery）：

  $.ajax({
    type: "GET",
    crossDomain: true,
    url: "http://local.site.com/endpoint,
    success: function (data) {
      alert(data);
    },
    error: function (request, error) {
      alert(error);
    }
  });
  

但是，当我调用此方法时，我在 Chrome 49 和 Firefox 33 的“网络”选项卡中只看到一个 GET 而没有预检 OPTIONS 请求。

以下是我来自 Chrome 的 GET 请求的详细信息：

Accept:*/*
Accept-Encoding:gzip, deflate, sdch
Accept-Language:en-US,en;q=0.8,ru;q=0.6
Connection:keep-alive
Host:local.adform.com
Origin:http://localhost:7500
Referer:http://localhost:7500/test-page.html
User-Agent:Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/49.0.2623.87 Safari/537.36

以及相应的回应：

Access-Control-Allow-Headers:Accept, Content-Type, Content-Length, Accept-Encoding, X-CSRF-Token, Authorization
Access-Control-Allow-Methods:POST, GET, OPTIONS, PUT, DELETE
Access-Control-Allow-Origin:*
Content-Length:2
Content-Type:text/plain; charset=utf-8
Date:Wed, 03 Aug 2016 10:53:19 GMT

对为什么我的浏览器不发送预检请求有任何想法吗？

Answer 1

正如评论员所指出的，使用 GET 浏览器并不总是发送预检 OPTIONS 请求。如果确实需要预检，让浏览器发送它的一种方法是设置自定义标头（例如“X-PINGOVER：pingpong”或其他）。请注意，该服务器还应允许此请求标头，方法是将其添加到“Access-Control-Allow-Headers”响应标头。

---

我的基本目标是将域 a.com 的 cookies 传递到 a.com 的服务器，但从另一个站点的页面 b.com （常见用例是跟踪您在 3rd 方网站上的用户）。事实证明，与请求一起发送 cookie 需要做更多的工作。

在客户端（即在 JavaScript 中）需要启用跨域请求并允许传递凭据。例如。以下 jQuery 请求对我有用：

$.ajax({
  type: "GET",
  url: "http://example.com",
  xhrFields: {
    withCredentials: true           // allow passing cookies
  },
  crossDomain: true,                // force corss-domain request                
  success: function (data) { ... },
  error: function (request, error) { ... }
});

在服务器端需要设置2个响应头：

• Access-Control-Allow-Credentials: true
• Access-Control-Allow-Origin: <requester origin>

其中<requester origin> 是执行调用的网站的协议+主机+端口。请注意，通用* 可能无法在许多浏览器中工作，因此服务器解析请求的Referer 标头并使用特定允许的来源进行响应是有意义的。