跨域请求仅在 Firefox 中被阻止! [选项:403 禁止]

Posted

技术标签:

【中文标题】跨域请求仅在 Firefox 中被阻止! [选项:403 禁止]【英文标题】:Cross-Origin Request Blocked in firefox only! [OPTIONS : 403 Forbidden] 【发布时间】:2017-04-08 09:58:03 【问题描述】:

又是 CORS 问题。 [* 我对 CORS 了解不多]

我的环境:

我将 json 文件存储在 Amazon S3 服务器中,并从我的 Web 应用程序中读取此 json 文件。

我的问题:

我只在 FireFox 中得到这个

跨域请求被阻止:同源策略不允许读取 server 上的远程资源。 (原因:CORS 标头 'Access-Control-Allow-Origin' 缺失)

注意:我已经在服务器 [Amazon S3] 中配置了 CORSRule,之后 Chrome 和其他浏览器就可以正常工作了。但是 FireFox 给出了这个错误。

在 FireFox 网络选项卡中[检查元素]:

状态:403

方法:选项

原因:xhr

类型:xml

请求标头:

Host: myWebApp.net
User-Agent: Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:49.0) Gecko/20100101 Firefox/49.0
Accept: text/plain, */*; q=0.01
Accept-Language: en-US,en;q=0.5
Accept-Encoding: gzip, deflate, br
X-Requested-With: XMLHttpRequest
Referer: https://myWebApp.net/page.jsp
Connection: keep-alive

响应标头:

Content-Length: 0
Date: Thu, 24 Nov 2016 07:27:30 GMT
Location: https://webApp.s3.amazonaws.com/file.json
Server: Apache-Coyote/1.1

我环顾四周,但没有找到任何原因。 所以我需要你的帮助。 由于它在 Chrome 浏览器中正常工作,因此问题仅在 FireFox 中。

如果可能,请逐步描述 [* 我对这件事不熟悉]

谢谢!

【问题讨论】:

【参考方案1】:

哎呀! 终于找到解决办法了。

问题出在 Amazon S3 的 CORSConfiguration

我对此了解不多,但现在它允许所有浏览器跨域。

我将 CORSConfiguration 更改为:

<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
 <CORSRule>
   <AllowedOrigin>https://myWebApp.net</AllowedOrigin>
   <AllowedMethod>GET</AllowedMethod>
   <AllowedMethod>POST</AllowedMethod>
   <AllowedMethod>PUT</AllowedMethod>
   <AllowedHeader>*</AllowedHeader>
  <MaxAgeSeconds>3000</MaxAgeSeconds>
  <ExposeHeader>x-amz-server-side-encryption</ExposeHeader>
  <ExposeHeader>x-amz-request-id</ExposeHeader>
  <ExposeHeader>x-amz-id-2</ExposeHeader>
 </CORSRule>
</CORSConfiguration>

根据此规则,浏览器可以获得正确的 Request HeadersResponse Headers

请求标头:

Host: myWebApp.s3.amazonaws.com
User-Agent: Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:49.0) Gecko/20100101 Firefox/49.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: en-US,en;q=0.5
Accept-Encoding: gzip, deflate, br
Access-Control-Request-Method: GET
Access-Control-Request-Headers: x-requested-with
origin: https://myWebApp.net
Connection: keep-alive
Cache-Control: max-age=0

响应标头:

Access-Control-Allow-Headers: x-requested-with
Access-Control-Allow-Methods: GET, POST, PUT
Access-Control-Allow-Origin: https://myWebApp.net
Access-Control-Max-Age: 3000
Content-Length: 0
Date: Thu, 24 Nov 2016 13:21:17 GMT
Server: AmazonS3
Vary: Origin, Access-Control-Request-Headers, Access-Control-Request-Method
access-control-allow-credentials: true
access-control-expose-headers: x-amz-server-side-encryption, x-amz-request-id, x-amz-id-2
x-amz-id-2: emYYMILNIdkCejpjuDXz4Haks87asdhj/7JL5AASt/8eIwKdgO1Gb/AzGRg7SU/GH55IVopScg=
x-amz-request-id: 307572CDFF39F443

【讨论】:

以上是关于跨域请求仅在 Firefox 中被阻止! [选项:403 禁止]的主要内容,如果未能解决你的问题,请参考以下文章

AngularJS 的 CORS 错误仅在 FireFox 中发布

选项(失败)仅在 Chrome 和 Firefox 上

Autodesk Forge 跨域请求被阻止错误

SVG 渲染但仅在 Firefox 中被切断 - 为啥?

什么属性在 Firefox 中被区别对待,阻止它正确显示

CORS 仅在 Firefox 和 Safari 上且仅在 onClick() 上阻止内容