CORS Origin 设置不正确?
CORS Origin set incorrectly?
- 我有一个 JavaScript 应用程序,假设它部署在
portal.example.com
。
- 其中包括一个
<script>
标签,用于加载从 assets.example.com
提供的源代码。
- JavaScript 文件向
admin.example.com
上的 API 发出 HTTP 请求
此 API 请求因 CORS 预检失败而出错。
Failed to load http://admin.example.com/v0/user/navigation: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://portal.example.com' is therefore not allowed access.
实际OPTIONS
请求如下
OPTIONS /v0/user/navigation HTTP/1.1
Host: admin.example.com
Connection: keep-alive
Access-Control-Request-Method: GET
Origin: http://portal.example.com
User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/63.0.3239.84 Safari/537.36
Access-Control-Request-Headers: authorization,x-correlation-id,x-user-domain
Accept: */*
Accept-Encoding: gzip, deflate
Accept-Language: en-US,en;q=0.9,en-GB;q=0.8
实际OPTIONS
响应如下
HTTP/1.1 200
Allow: GET
Access-Control-Allow-Headers: authorization,x-correlation-id,x-user-domain
Access-Control-Allow-Methods: GET
Access-Control-Allow-Origin: http://portal.example.com
Vary: Origin
Content-Length: 0
Date: Tue, 20 Feb 2018 12:12:19 GMT
Set-Cookie: 97d2c19dadc3933a73dce9bec0748df1=5a15895c5e0f5b526c177132cb4aa666; path=/; HttpOnly
Cache-control: private
X-RBT-SCAR: 10.127.48.7:777511903:1000
我认为问题是因为请求实际上来自 assets.example.com
发出请求的脚本。所以我应该在 OPTIONS
响应中返回 Access-Control-Allow-Origin: http://assets.example.com
。但是,我听从了 W3C.
的建议
The Access-Control-Allow-Origin header indicates whether a resource can be shared based by returning the value of the Origin request header, "*", or "null" in the response.
所以我误解了 CORS,还是浏览器发送了主执行 URL 的 Origin
而不是发出请求的脚本的 URL?
已更新
获取响应
HTTP/1.1 200
X-Correlation-Id: 8978b245-081a-4c4a-b4c9-73f2920ab55c
Content-Type: application/vnd.example+json
Transfer-Encoding: chunked
Date: Tue, 20 Feb 2018 13:22:39 GMT
Set-Cookie: 97d2c19dadc3933a73dce9bec0748df1=dc4e3543c3071d752959e7176c5e4d29; path=/; HttpOnly
Cache-control: private
X-RBT-SCAR: 10.127.48.7:778160108:2000
No 'Access-Control-Allow-Origin' header is present on the requested resource.
这意味着缺少 'Access-Control-Allow-Origin' header,而不是不允许您的域。
如果您没有权限,您会看到类似
的内容
The 'Access-Control-Allow-Origin' header has a value 'http://www.example.com' that is not equal to the supplied origin.
因此,要解决您的问题,您需要配置 GET
响应以提供必要的 CORS header 以及 OPTIONS
响应。
在您编辑的问题中,GET
响应 headers 没有为 Access-Control-*
提供任何内容,所以这就是您收到错误的原因!
您的 CORS 预检 未 失败 - 您收到 200 响应和所有必需的 CORS 响应 headers...
但是,您没有在 GET 响应中 returning 任何 CORS 响应 header - 是失败的原因。至少,您需要 return 一个 Access-Control-Allow-Origin
响应 header 与 return 在 OPTIONS 响应中输入的响应相匹配。
因此,只需将其包含在您的 GET 响应中就可以了:
Access-Control-Allow-Origin: http://portal.example.com
最后,浏览器添加了 Origin
请求 header,相信我 - 这是正确的。但发送 什么 值并不重要,因为所需要的只是 Access-Control-Allow-Origin
响应 header 匹配 Origin 请求 header(通过具有“*”值或与 Origin 值完全匹配)。
- 我有一个 JavaScript 应用程序,假设它部署在
portal.example.com
。 - 其中包括一个
<script>
标签,用于加载从assets.example.com
提供的源代码。 - JavaScript 文件向
admin.example.com
上的 API 发出 HTTP 请求
此 API 请求因 CORS 预检失败而出错。
Failed to load http://admin.example.com/v0/user/navigation: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://portal.example.com' is therefore not allowed access.
实际OPTIONS
请求如下
OPTIONS /v0/user/navigation HTTP/1.1
Host: admin.example.com
Connection: keep-alive
Access-Control-Request-Method: GET
Origin: http://portal.example.com
User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/63.0.3239.84 Safari/537.36
Access-Control-Request-Headers: authorization,x-correlation-id,x-user-domain
Accept: */*
Accept-Encoding: gzip, deflate
Accept-Language: en-US,en;q=0.9,en-GB;q=0.8
实际OPTIONS
响应如下
HTTP/1.1 200
Allow: GET
Access-Control-Allow-Headers: authorization,x-correlation-id,x-user-domain
Access-Control-Allow-Methods: GET
Access-Control-Allow-Origin: http://portal.example.com
Vary: Origin
Content-Length: 0
Date: Tue, 20 Feb 2018 12:12:19 GMT
Set-Cookie: 97d2c19dadc3933a73dce9bec0748df1=5a15895c5e0f5b526c177132cb4aa666; path=/; HttpOnly
Cache-control: private
X-RBT-SCAR: 10.127.48.7:777511903:1000
我认为问题是因为请求实际上来自 assets.example.com
发出请求的脚本。所以我应该在 OPTIONS
响应中返回 Access-Control-Allow-Origin: http://assets.example.com
。但是,我听从了 W3C.
The Access-Control-Allow-Origin header indicates whether a resource can be shared based by returning the value of the Origin request header, "*", or "null" in the response.
所以我误解了 CORS,还是浏览器发送了主执行 URL 的 Origin
而不是发出请求的脚本的 URL?
已更新
获取响应
HTTP/1.1 200
X-Correlation-Id: 8978b245-081a-4c4a-b4c9-73f2920ab55c
Content-Type: application/vnd.example+json
Transfer-Encoding: chunked
Date: Tue, 20 Feb 2018 13:22:39 GMT
Set-Cookie: 97d2c19dadc3933a73dce9bec0748df1=dc4e3543c3071d752959e7176c5e4d29; path=/; HttpOnly
Cache-control: private
X-RBT-SCAR: 10.127.48.7:778160108:2000
No 'Access-Control-Allow-Origin' header is present on the requested resource.
这意味着缺少 'Access-Control-Allow-Origin' header,而不是不允许您的域。
如果您没有权限,您会看到类似
的内容The 'Access-Control-Allow-Origin' header has a value 'http://www.example.com' that is not equal to the supplied origin.
因此,要解决您的问题,您需要配置 GET
响应以提供必要的 CORS header 以及 OPTIONS
响应。
在您编辑的问题中,GET
响应 headers 没有为 Access-Control-*
提供任何内容,所以这就是您收到错误的原因!
您的 CORS 预检 未 失败 - 您收到 200 响应和所有必需的 CORS 响应 headers...
但是,您没有在 GET 响应中 returning 任何 CORS 响应 header - 是失败的原因。至少,您需要 return 一个 Access-Control-Allow-Origin
响应 header 与 return 在 OPTIONS 响应中输入的响应相匹配。
因此,只需将其包含在您的 GET 响应中就可以了:
Access-Control-Allow-Origin: http://portal.example.com
最后,浏览器添加了 Origin
请求 header,相信我 - 这是正确的。但发送 什么 值并不重要,因为所需要的只是 Access-Control-Allow-Origin
响应 header 匹配 Origin 请求 header(通过具有“*”值或与 Origin 值完全匹配)。