在 Ionic v1 项目/应用程序上升级 WKWebView 后的 XMLHttpRequest 错误 config.xmlWKWebView服务器

如何解决在 Ionic v1 项目/应用程序上升级 WKWebView 后的 XMLHttpRequest 错误 config.xmlWKWebView服务器

在尝试将我的工作应用上传到商店后，我遇到了来自应用商店连接的错误消息，说我无法再使用 UIWebview，因为它已被弃用，因此我被迫升级到WKWebView。

我按照this个问题的答案

当我现在尝试登录我的应用程序时，我在 Safari 控制台上收到以下错误：

Access-Control-Allow-Origin 不允许 Origin ionic://localhost

由于访问控制检查，XMLHttpRequest 无法加载 https://www.demo.mywebsite.com/mobile/pages/login

无法加载资源：Access-Control-Allow-Origin 不允许 Origin ionic://localhost。

在我的 config.xml 中有这个

<access origin="http://localhost:8080/*" />
<allow-navigation href="*" />

我还通过这种方式在我的服务器 PHP 文件上设置标头：

header("Access-Control-Allow-Origin: http://localhost:8080/*");
header("Content-Type: application/json");
header("Access-Control-Allow-Headers: content-type,authorization");
header("Access-Control-Allow-Credentials: true");

我的网站托管在 Windows Server 2016 上。在 WKWebView 升级之前，一切正常，但现在，我根本无法使用该应用程序，因为它包含大量 HTTP 请求。

更新

我刚刚进行了这些更改：

<access origin="*" />
<allow-navigation href="*" />

以及我的服务器文件中的这个：

header("Access-Control-Allow-Origin: *");

我不再收到 ionic://localhost 错误和 Failed to load resources 错误，但我收到此错误：

当凭据标志为真时，不能在 Access-Control-Allow-Origin 中使用通配符。

解决方法

config.xml

访问
« 定义允许应用程序通信的外部域集 和。上面显示的默认值允许它访问任何服务器。 » 见documentation。

此设置与执行请求时应用的 origin 无关。

根据您的config.xml，您的应用只能与http://localhost:8080/* 通信。您显然想在此处使用 *（如果您的应用仅向您的服务器发出请求，则使用您的服务器网址）。

<access origin="*"></access>

WKWebView

iOS 偏好设置
« 从第 3 版开始，默认情况下，应用从 iOS 上的 ionic:// 方案提供。

来自 iOS WebView 的请求的默认来源是 ionic://localhost。如果设置了 Hostname 和 iosScheme 首选项，则 原点将为 iosSchemeValue://HostnameValue。

http、https 或 file 之类的值无效，将使用默认值代替。 »
见documentation。

在您的服务器上，您需要允许源 ionic://localhost。
假设您希望 Android 设备也能够与您的服务器通信，您需要同时允许 ionic://localhost 和 http://localhost，或者 * 允许所有来源。

服务器

您可以像这样在您的服务器中允许两个来源。

$allowedDomains = ['ionic://localhost','http://localhost'];

if (in_array($_SERVER['HTTP_ORIGIN'],$allowedDomains)) {
    header('Access-Control-Allow-Origin: ' . $_SERVER['HTTP_ORIGIN']);
}