cors - iPhone 模拟器中的 Ionic 3 CORS 问题

Question

我认为是 iPhone 模拟器版本 SimulatorApp-829.6/xCode 9.0 中的 CORS 问题

我用 Cordova 构建了一个 ionic3 应用程序，可以使用代理在浏览器中运行它。但是当我在 SIM 卡或手机上运行它时，它不会针对远程 http 调用进行身份验证。

所以我添加了 Cordova 调试器并调试到 xCode 控制台:

这是 http 错误对象:

{"_body":{"isTrusted":true},"status":0,"ok":false,"statusText":"","headers":{},"type":3,"url":null}

这是我在 Ionic 应用程序中执行的代码(在浏览器中运行)

    let headers = new Headers();
    headers.append('Content-Type', 'application/json');
    headers.append('Authorization', 'Basic ' + this.base64Service.encode(id + ':' + pw));
    headers.append('Access-Control-Allow-Origin', '*');
    

    return this.http.get('http://myserver.com/api/v1/authenticate', {headers: headers}).map(res => res.json());

我真的很困惑，因为有两件事:

1) 我安装了 Cordova 白名单插件并且在远程服务器上取得了成功。不确定发生了什么

2) 如果我使用 Safari Developer > Simulator 并连接到在模拟器中运行的应用程序，则会出现此错误:

Failed to load resource: Origin http://localhost:8080 is not allowed by Access-Control-Allow-Origin.

XMLHttpRequest cannot load http://myserver.com/api/v1/authenticate. Origin http://localhost:8080 is not allowed by Access-Control-Allow-Origin.

如何在 Sim 或实际设备中发现 CORS 问题？我认为资源都是基于 file://的。另外，为什么 Cordova 白名单插件不解决这个问题？

提前致谢。在这上面花了很多时间。

Answer 1

我最近遇到了类似的问题。我的 ionic 应用程序已经运行了几个月没有问题，但我突然开始在 iOS 上收到 CORS 错误。

问题是我从 UIWebview 切换到使用 WKWebView。

This blog post详细解释了 WKWebView 以及为什么它比它的前身好得多。

它还提到了有关 CORS 的内容:

UIWebview, or the older webview in iOS, never actually enforced CORS, but WKWebView does and does not provide a way to disable it. To address this, you need to implement CORS correctly and add the following entry:

Origin: http://localhost:8080

IF this is not possible (you do not own the API), a workaround can be to use the native HTTP plugin, @ionic-native/http.

所以两种解决方案是:

1. 如果您拥有正在使用的 API，请在其上启用 CORS
2. 如果你不能修改api，你可以使用Ionic Native Http

我选择了第一个，然后一切又开始正常工作了。