javascript-CORS请求在Safari中不起作用

我正在提出CORS xhr请求。 这在chrome中工作正常，但是当我在野生动物园中运行时，出现“无法加载---- Access-control-allow-origin不允许的访问”。 代码完全相同，我已经在服务器上设置了CORS。 以下是我的代码。(具有访问控制，但是如果没有accessToken，您可以自由尝试)

var water;

var req = new XMLHttpRequest;

req.overrideMimeType("application/json");

req.open('GET', 'https://storage.googleapis.com/fflog/135172watersupplies_json', true);

req.setRequestHeader('Authorization', 'Bearer ' + accessToken);

origThis = this;

var target = this;

req.onload = function() {

water = req;

req.send(null);

查看请求标头后，我看到首先发出了OPTIONS请求，这是不允许的请求。 原始标头未包含在Safari的响应中，但位于chrome中。 是什么原因造成的。 任何帮助将不胜感激。

更新：我已经在Windows的Safari浏览器中进行了尝试，并且可以正常运行，所以我不确定这里发生了什么。 我使用的Mac是远程访问(Macincloud.com)，但我认为这与它无关。

10个解决方案

45 votes

对Amazon S3中的文件发出XHR请求时遇到了相同的错误。 在Safari 7上失败了。 我知道您没有使用Amazon S3，但我想我会发布以防此解决方案对其他人有所帮助。

问题是Safari 7将Access-Control-Request-Headers标头设置为“原始的x请求的”，但是我的AWS CORS配置仅允许“ x请求的”：

*

GET

3000

Authorization

x-requested-with

我添加了“ origin”作为允许的标题，并且一切正常。

origin

注意：*的AllowedOrigin仅用于开发目的。 有关更多信息，请参见下面的@andes评论。

Seth answered 2020-02-21T15:59:34Z

8 votes

我只是有一个类似的问题，CORS错误。 它可以在Firefox和Chrome中运行，但不能在Safari 10中运行。

原来，我们需要在JSON URL上加上斜杠。

William Macdonald answered 2020-02-21T15:59:58Z

1 votes

就我而言，这是Accept-Langauge标头的问题。 我在Access-Control-Allow-Headers中添加了Accept-Language，此问题已解决。

deen answered 2020-02-21T16:00:18Z

0 votes

对于CORS请求，您应该使用起源fflog.storage.googleapis.com。如果您使用常见的overrideMimeType起源，则任何站点都可以访问您的存储桶。

有尝试尝试删除overrideMimeType吗？ 如果设置了mime类型，它将正确返回。

我也对Safari POST请求有问题，但还没有答案。 GET确定。

Kyaw Tun answered 2020-02-21T16:00:48Z

0 votes

尝试删除替代mime类型。

var

jsonhandler=function(){var req=JSON.parse(this.response);console.log(req)},

req=new XMLHttpRequest;

req.open('GET','https://storage.googleapis.com/fflog/135172watersupplies_json');

req.setRequestHeader('Authorization','Bearer '+accessToken);

req.οnlοad=jsonhandler;

req.send();

cocco answered 2020-02-21T16:01:07Z

0 votes

当我查询您的URL时，我将获得以下访问控制标头：

Access-Control-Allow-Origin: *

Access-Control-Expose-Headers: Authorization, Cache-Control, Content-Length, Date, Expires, Server, Transfer-Encoding, x-goog-meta-foo1

我怀疑这与您的Access-Control标头有关-是您遗漏了某些内容，还是过于具体。

鉴于您实际上正在发送自定义标头，因此您可能需要尝试：

Access-Control-Allow-Headers: *

您还会看到遗漏Access-Control-Expose-Headers是否有所作为。

除此之外，查看实际的请求/响应标头实际上也将有所帮助。

Luke answered 2020-02-21T16:01:46Z

0 votes

当我尝试

curl -v -X OPTIONS \

-H 'Origin: fflog.storage.googleapis.com' \

-H 'Access-Control-Request-Method: GET' \

https://storage.googleapis.com/fflog/135172watersupplies_json

除了其他标题，我得到了：

Access-Control-Allow-Origin: *

当我在Mac OS 10.8.3上针对Safari 6.0.4的Access-Control-Allow-Origin执行AJAX请求时，出现403错误，但它们全部执行。

因此，我只能猜测您正在尝试发送带通配符Access-Control-Allow-Origin的凭据请求。

Old Pro answered 2020-02-21T16:02:19Z

0 votes

感谢所有答复，我终于自己得到了。 我在responseHeaders中添加了“ Origin”，现在可以正常工作了。

Patrick answered 2020-02-21T16:02:39Z

0 votes

至于Amazon S3，它仅在我添加了更多允许的标头Content-Type和Range后才能在Safari中使用。 其中之一完成了工作。

*

GET

POST

3000

Authorization

Origin

X-Requested-With

Content-Type

Range

Edhowler answered 2020-02-21T16:02:59Z

0 votes

我在CORS在Chrome中工作时遇到了同样的问题，但是在Safari中抛出了原点错误。 原来这是一个Kerberos授权问题。 当我直接在Safari中加载XHR URL时，系统会提示我输入凭据。 输入它们后，我返回了原始站点，Safari不再出现CORS错误。

Seth Moore answered 2020-02-21T16:03:20Z