javascript - CORS - 如何 'preflight' 一个 httprequest？

Question

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

在服务器端，我的 Web 方法正在向 HTTP 响应添加“Access-Control-Allow-Origin: *”。我可以看到响应现在确实包含此 header 。我的问题是:如何“预检”请求(选项)？我正在使用 jQuery.getJSON 发出 GET 请求，但浏览器立即取消了臭名昭著的请求:

Origin http://localhost is not allowed by Access-Control-Allow-Origin

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

谢谢!

Answer 1

在预检请求期间，您应该看到以下两个 header :Access-Control-Request-Method 和 Access-Control-Request-Headers。这些请求 header 要求服务器提供发出实际请求的权限。您的预检响应需要确认这些 header 才能使实际请求生效。

例如，假设浏览器发出带有以下 header 的请求:

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

然后您的服务器应使用以下 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 。这个header的值应该和Access-Control-Request-Headers请求头中的headers一样，不能是'*'。

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