Angular GET 请求错误,但仅在 Safari iOS 上

Posted

技术标签:

【中文标题】Angular GET 请求错误,但仅在 Safari iOS 上【英文标题】:Angular GET request error, but only on safari iOS 【发布时间】:2014-12-22 14:55:48 【问题描述】:

我正在使用 WordPress 作为后端,AngularJS 作为前端来构建一个网站。我正在使用 WordPress JSON API 将我的数据发送到前端。

https://wordpress.org/plugins/json-api/

问题

我正在使用 AngularJS 从 WordPress JSON API 获取我的数据。我创建了以下服务:

this.getPage = function ( slug ) 
    return $http.get('wordpress/api/get_page/?slug=' + slug)

我在控制器中使用此服务来获取当前页面,如下所示:

HTTPService.getPage('home')
    .success(function ( data ) 
        $scope.page = data.page;
        console.log(arguments);
    )
    .error( function () 
        console.log(arguments);
    )

这在所有浏览器中都可以正常工作,ios 上的 Safari 除外。在 iOS 上的 Safari 上,当我记录错误参数时得到以下响应:

这是我将 iPhone 连接到 Mac 时显示的 Safari 调试器。我得到的错误响应是错误代码 0..

到目前为止我已经尝试过什么

我在.htaccess 文件中设置了Access-Control-Allow-Origin "*",但这似乎不起作用。该请求是在具有相对 URL 的同一域上完成的,所以我认为这不是问题。

那么,有谁知道为什么这在 Safari (iOS) 上不起作用?

编辑

根据要求提供一些额外信息:

【问题讨论】:

safari iOS7 和 safari iOS8 都出现该错误 你能把你的代码发布到 jsfiddle 吗? 错误参数从哪里打印?您能否发布错误处理程序 (function(data, status, headers, config)) 或更多代码的所有参数的打印?您还应该查看this old question。 请显示更多关于通讯的细节。在network 选项卡中,请显示请求和响应的标头 + 响应的状态码。 (顺便说一句。我遇到了很多奇怪的 iOS 错误行为,所以如果你的只是另一个错误,我不会感到很惊讶。) 错误代码 0 表示请求被中止、超时或被取消。如果没有看到网络选项卡或错误 XHR,真的无法弄清楚其他任何事情 【参考方案1】:

我很确定这是因为 Safari 是唯一具有默认阻止“第三方 cookie 和其他网站数据”策略的浏览器。实际上,这个问题不应该是 Safari iOS 独有的,它也应该发生在 OSX 上的 Safari 上。我很确定,如果您的 MacBook 没有发生这种情况,是因为有一天您更改了“隐私”的默认设置。

您可以试试这个,打开 Safari,转到“首选项”并在“价格”选项卡下检查您是否有选项:“阻止 cookie 和其他网站数据”设置为“来自第三方和广告商”。这是现代版 Safari 中的第一个也是默认选项。

在您的 MacBook 中,它会如下所示:

在 iOS 中它看起来像这样:

只是为了确认这实际上是导致您的问题的原因:将此设置更改为“从不”,清除缓存并尝试再次重现该问题。我非常有信心您将无法复制它。

现在,如果您将其设置回“阻止 cookie 和其他网站数据:来自第三方和广告商”并且您首先清除缓存,您将再次遇到该问题(无论是 iOS 还是操作系统)。在您确认这是问题的原因后,将此设置重新设置为“来自第三方和广告商”,以便您可以使用默认设置重现和解决问题。

请记住,每次您想重新测试此问题时,最好清除 Safary 的缓存。否则,Safari 可能会认为提供 API 的站点是可信的,而您将无法重现该问题。因此,为了确保您每次测试时都清除缓存

我认为这个问题的根源在于 Safari 希望确保用户在主页加载该内容之前与它提供“第 3 方内容”的页面进行了直接交互。

我需要更多地了解您的项目才能提出“最佳”解决方案。例如:最终的应用程序是否会与 API 集成在同一域下?因为如果是这样的话,当你投入生产时你不应该有这个问题。我的意思是,如果您正在开发的应用程序将托管在:http://whatever.yourDomain.org 并且 API 将成为同一域 (yourDomain.org) 的一部分,那么您在生产中根本不应该遇到这个问题。

另一方面,如果您需要将 API 托管在不同的域下,那么您必须找到一种“欺骗”Safari 的方法。看看这个:

Safari 3rd party cookie iframe trick no longer working?

还有这个:

http://www.allannienhuis.com/archives/2013/11/03/blocked-3rd-party-session-cookies-in-iframes/

我希望这会有所帮助。

【讨论】:

OP 写道:请求是在具有相对 URL 的同一个域上完成的,因此 3rd 方 cookie 在这里应该没有问题。 在 iOS 中更改设置并清除我的浏览器缓存实际上解决了问题。现在我似乎无法重现该错误。是的,api已经在同一个域上,但是问题出现在生产站点上,这就是我仍然不明白的地方。 谢谢,我会接受你的回答,因为它解决了问题!然而,我仍然不太明白它是如何发生的,因为现在我无法重现它:p.. 我敢肯定这不仅仅是我,因为它也发生在其他人的 iPhone 上。 @koningdavid 至少现在你走对了。 @koningdavid 感谢您接受答案。但是,我想找到问题的根源。您能否尝试在“虚拟”站点中复制它,以便我们可以复制它?

以上是关于Angular GET 请求错误,但仅在 Safari iOS 上的主要内容,如果未能解决你的问题,请参考以下文章

错误-TypeError:仅在向 Angular 5 应用程序内的 api 服务器发出 GET 请求后,在 Safari 上输入错误

错误 - TypeError:在对angular 5 app内的api服务器发出GET请求后,仅在Safari上键入错误

浏览器:标识符输入已经声明,但仅在wordpress上有效?

mysqldump 抛出“拒绝访问”错误,但仅在通过 logrotate 运行时?

运行时错误,但仅在第二个循环中

尝试保存时 VBA 宏抛出错误(但仅在一台计算机上)