iOS上的Ionic InAppBrowser加载白色空白屏幕错误答案

【问题标题】：Ionic InAppBrowser on iOS Loading White Blank Screen ErroriOS上的Ionic InAppBrowser加载白色空白屏幕错误
【发布时间】：2018-11-14 09:35:15
【问题描述】：

我使用 InAppBrowser 已经有一段时间了，之前没有遇到过这个问题。它正在加载我的 URL，现在它似乎不想这样做。

首先我已正确导入 InAppBroswer，它在 Android 上 100% 运行。这是一个仅限 iOS 的问题。

在我的 config.xml 中：

<access origin="https://www.mydomain.or/*" />
<allow-intent href="*" />
<allow-intent href="http://*/*" />
<allow-intent href="https://*/*" />
<!-- Call to Plugins -->
<plugin name="cordova-plugin-whitelist" spec="1.3.3" />
<plugin name="cordova-plugin-device" spec="2.0.2" />
<plugin name="cordova-plugin-splashscreen" spec="5.0.2" />
<plugin name="cordova-plugin-ionic-keyboard" spec="2.0.5" />
<plugin name="cordova-plugin-inappbrowser" spec="^3.0.0" />
<plugin name="cordova-plugin-statusbar" spec="^2.4.2" />
<plugin name="cordova-plugin-app-update" spec="^1.6.0" />
<plugin name="cordova-plugin-app-version" spec="^0.1.9" />
<engine name="android" spec="~7.0.0" />
<engine name="ios" spec="~4.5.4" />

我的插件似乎运行良好，没有 lint 或编译错误。

我根据他们的文档调用浏览器：

//construct the instance of browser we are using to launch with Ionic Native
const browser = this.iab.create('https://www.mydomain.or', '_blank','location=no');
//If Browser is Hidden Display
browser.show();

WKWebView 的控制台中根本没有报告任何错误，但我在模拟器和设备上都得到了下面的图像。

尝试解决此问题的步骤如下：使用 iOS 的安全步骤，将白名单添加到插件中——请参阅上面的插件列表。我已将检查添加到 plist 文件中：

<key>NSAppTransportSecurity</key>
<dict>
  <key>NSExceptionDomains</key>
  <dict>
    <key>localhost</key>
    <dict>
      <key>NSExceptionAllowsInsecureHTTPLoads</key>
      <true/>
    </dict>
    <key>www.mydomain.or</key>
    <dict/>
  </dict>
</dict>

众所周知，这有助于解决过去的类似问题。我还在我的索引中添加了一个元标记，因为这在过去也帮助了其他人：

<meta http-equiv="Content-Security-Policy" content="default-src 'self'; style-src 'self’; connect-src https://www.mydomain.or; script-src 'self’; media-src *">

这也完全没有帮助我。任何可能知道这是什么原因的人都会有很大的帮助。我觉得我对这个错误束手无策，希望能够解决这个问题，但也知道发生这种情况的根本原因，以便将来避免它。

提前致谢！

【问题讨论】：

标签： ios cordova ionic-framework phonegap inappbrowser

【解决方案1】：

直到最近我都在为这个问题苦苦挣扎。

在 config.xml

    <allow-navigation href="*" />

这个标签似乎解决了这个问题。

--- 更新 --

info.plist

<key>NSAppTransportSecurity</key>
<dict>
    <key>NSAllowsArbitraryLoads</key>
    <true/>
    <key>NSExceptionDomains</key>
    <dict>
        <key>localhost</key>
        <dict>
            <key>NSExceptionAllowsInsecureHTTPLoads</key>
            <true/>
        </dict>
    </dict>
</dict>

【讨论】：

这似乎并没有解决我的问题，我仍然得到相同的结果。您用来解决此问题的一些方法是什么？希望我提供的信息足够详细，可以帮助您了解到目前为止我已完成的步骤
您能否上传您的 config.xml 以澄清问题？我还将上传我的 info.plist 以进行澄清。请再次检查我的答案。
我没有系统的方法来解决这个问题，因为很明显这是权限问题之一。所以我只是浏览了很多文档和页面，尝试和错误。
谢谢，我确实找到了问题所在。当您运行“ionic cordova platform add ios”时，info.plist 现在应该使用 Ionic CLI 更新。 '' 似乎也与相同。该问题与安全相关，但能够通过我提供的答案解决
有趣。它可以是更安全的解决方案。但是，与 'Webview navigation' 相关，而与 '' 相关系统打开”。stackoverflow.com/a/35374403/6627660

【解决方案2】：

已解决我能够通过添加来解决这个问题：

<meta http-equiv="Content-Security-Policy" content="default-src gap://ready file://* *; script-src 'self' 'unsafe-inline' 'unsafe-eval' *; style-src 'self' 'unsafe-inline' *”>

这将添加到您的 index.html 文件的标题中。我上面的问题显然有一些语法错误，但在构建到 Android 或 iOS 时不会调用错误。

但是，您可以添加构建工具来编写脚本来检查 index.html 中的此标记。

【讨论】：