AngularJS 对跨域资源执行 OPTIONS HTTP 请求 [英] AngularJS performs an OPTIONS HTTP request for a cross-origin resource

问题描述

我正在尝试设置 AngularJS 以与跨域资源通信，其中提供我的模板文件的资产主机位于不同的域中，因此 angular 执行的 XHR 请求必须是跨域的.我已将适当的 CORS 标头添加到我的服务器以供 HTTP 请求使用，但它似乎不起作用.问题是，当我在浏览器 (chrome) 中检查 HTTP 请求时，发送到资产文件的请求是一个 OPTIONS 请求(它应该是一个 GET 请求).

I'm trying to setup AngularJS to communicate with a cross-origin resource where the asset host which delivers my template files is on a different domain and therefore the XHR request that angular performs must be cross-domain. I've added the appropriate CORS header to my server for the HTTP request to make this work, but it doesn't seem to work. The problem is that when I inspect the HTTP requests in my browser (chrome) the request sent to the asset file is an OPTIONS request (it should be a GET request).

我不确定这是 AngularJS 中的错误还是我需要配置一些东西.据我了解，XHR 包装器无法发出 OPTIONS HTTP 请求，因此看起来浏览器正在尝试确定是否允许"在执行 GET 请求之前先下载资产.如果是这种情况，那么我是否需要设置 CORS 标头(Access-Control-Allow-Origin: http://asset.host...) 和资产主机?

I'm not sure whether this is a bug in AngularJS or if I need to configure something. From what I understand the XHR wrapper can't make an OPTIONS HTTP request so it looks like the browser is trying to figure out if is "allowed" to download the asset first before it performs the GET request. If this is the case, then do I need to set the CORS header (Access-Control-Allow-Origin: http://asset.host...) with the asset host as well?

推荐答案

OPTIONS 请求绝不是 AngularJS 的错误，这就是跨域资源共享标准要求浏览器行为的方式.请参考此文档:https://developer.mozilla.org/en-US/docs/HTTP_access_control，在概述"部分，它说:

OPTIONS request are by no means an AngularJS bug, this is how Cross-Origin Resource Sharing standard mandates browsers to behave. Please refer to this document: https://developer.mozilla.org/en-US/docs/HTTP_access_control, where in the "Overview" section it says:

跨域资源共享标准通过添加新的 HTTP允许服务器描述一组源的标头允许使用网络浏览器阅读该信息.此外，对于可能对用户数据产生副作用的 HTTP 请求方法(在特定;对于 GET 以外的 HTTP 方法，或用于 POST 使用某些 MIME 类型).该规范要求浏览器预检"请求，从服务器请求支持的方法带有 HTTP OPTIONS 请求标头，然后在批准"来自服务器，使用实际的 HTTP 请求发送实际请求方法.服务器还可以通知客户端是否凭据"(包括 Cookie 和 HTTP 身份验证数据)应与请求.

The Cross-Origin Resource Sharing standard works by adding new HTTP headers that allow servers to describe the set of origins that are permitted to read that information using a web browser. Additionally, for HTTP request methods that can cause side-effects on user data (in particular; for HTTP methods other than GET, or for POST usage with certain MIME types). The specification mandates that browsers "preflight" the request, soliciting supported methods from the server with an HTTP OPTIONS request header, and then, upon "approval" from the server, sending the actual request with the actual HTTP request method. Servers can also notify clients whether "credentials" (including Cookies and HTTP Authentication data) should be sent with requests.

很难提供适用于所有 WWW 服务器的通用解决方案，因为设置会因服务器本身和您打算支持的 HTTP 动词而异.我鼓励您阅读这篇出色的文章 (http://www.html5rocks.com/en/tutorials/cors/)，其中包含有关需要由服务器发送的确切标头的更多详细信息.

It is very hard to provide a generic solution that would work for all the WWW servers as setup will vary depending on the server itself and HTTP verbs that you intend to support. I would encourage you to get over this excellent article (http://www.html5rocks.com/en/tutorials/cors/) that has much more details on the exact headers that needs to be sent by a server.

这篇关于AngularJS 对跨域资源执行 OPTIONS HTTP 请求的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！