CORS - 如何进行“预检”？一个http请求？

Question

我正在尝试向 WCF 服务（我拥有的）发出跨域 HTTP 请求。我已经阅读了几种处理跨域脚本限制的技术。因为我的服务必须同时容纳 GET 和 POST 请求，所以我无法实现某些 src 是 GET 请求的 URL 的动态脚本标记。由于我可以自由地在服务器上进行更改，因此我开始尝试实现一种解决方法，其中涉及配置服务器响应以包含“Access-Control-Allow-Origin”标头以及带有 OPTIONS 请求的“预检”请求。我从这篇文章中得到了这个想法：让 CORS 工作

在服务器上另一方面，我的 Web 方法正在将“Access-Control-Allow-Origin: *”添加到 HTTP 响应中。我可以看到响应现在确实包含此标头。我的问题是：如何“预检”请求（选项）？我正在使用 jQuery.getJSON 发出 GET 请求，但浏览器立即取消请求，并出现以下臭名昭著的情况：

Access-Control-Allow-Origin 不允许来源 http://localhost

有人熟悉这种 CORS 技术吗？客户需要进行哪些更改才能预检我的请求？

谢谢！

Answer 1

在预检请求期间，您应该看到以下两个标头：Access-Control-Request-Method 和 Access-Control-Request-Headers。这些请求标头向服务器请求发出实际请求的权限。您的预检响应需要确认这些标头才能使实际请求发挥作用。

例如，假设浏览器发出包含以下标头的请求：

Origin: http://yourdomain.com
Access-Control-Request-Method: POST
Access-Control-Request-Headers: X-Custom-Header

然后，您的服务器应使用以下标头进行响应：

Access-Control-Allow-Origin: http://yourdomain.com
Access-Control-Allow-Methods: GET, POST
Access-Control-Allow-Headers: X-Custom-Header

特别注意 Access-Control-Allow-Headers 响应标头。该 header 的值应该与 Access-Control-Request-Headers 请求头中的 headers 相同，并且不能是 '*'。

一旦您将此响应发送到预检请求，浏览器将发出实际请求。您可以在此处了解有关 CORS 的更多信息：http://www.html5rocks.com/en/tutorials/cors/

Answer 2

尽管这个帖子可以追溯到 2014 年，但这个问题对我们许多人来说仍然是当前的问题。以下是我在 jQuery 1.12 /PHP 5.6 上下文中处理它的方法：

• jQuery 仅使用有限的标头发送其 XHR 请求；仅发送了“起源”。
• 不需要预检请求。
• 服务器只需检测到这样的请求，并添加“Access-Control-Allow-Origin:”。 $_SERVER['HTTP_ORIGIN'] 标头，在检测到这是跨源 XHR 后。

PHP 代码示例：

if (!empty($_SERVER['HTTP_ORIGIN'])) {
    // Uh oh, this XHR comes from outer space...
    // Use this opportunity to filter out referers that shouldn't be allowed to see this request
    if (!preg_match('@\.partner\.domain\.net$@'))
        die("End of the road if you're not my business partner.");

    // otherwise oblige
    header("Access-Control-Allow-Origin: " . $_SERVER['HTTP_ORIGIN']);
}
else {
    // local request, no need to send a specific header for CORS
}

特别是，不要添加 exit;，因为不需要预检。