Cordova/Phonegap 在 Cordova 主 web 视图中加载外部站点

Question

我想要什么

我有外部网络资源，我希望 cordova webview 能够简单地打开并能够通过其内部导航进行导航。

说明

InAppBrowser 文档说

InAppBrowser 窗口的行为类似于标准 Web 浏览器，但不能 访问 Cordova API。因此，建议使用 InAppBrowser 如果您需要加载第三方（不受信任）内容，而不是 将其加载到 Cordova 主 web 视图中

所以我有一个受信任的外部链接（假设http://www.google.com 我想在主 webview 中加载并希望通过 window.location.href 或用户链接单击来控制其进程。

我尝试了什么

使用最新的 Cordova 生成 hello world 应用并插入

window.location.href = 'http://www.google.com/'

到它的 onDeviceReady。它的配置已经有了（我试图将其更改为具体地址）

<access origin="*" />

我还尝试了 window.open 和手动用户链接点击，但我所拥有的只是在外部浏览器中打开链接的对话框，而不是在同一个 webview 中呈现它。 我还尝试了 InAppBrowser 扩展，当我禁用导航栏时它工作正常，但它存在通信问题并且不适用于手动链接舔和 window.location.href 更改。

Answer 1

在 ios 和 android 上使用以下规则解决了这个问题：

<access origin="*" />
<allow-navigation href="*" />
<allow-navigation href="http://*/*" />
<allow-navigation href="https://*/*" />
<allow-navigation href="tel:*" />
<allow-navigation href="sms:*" />
<allow-navigation href="mailto:*" />
<allow-navigation href="geo:*" />

如果您遇到同样的问题，您还需要了解以下内容：

• 当文档对于当前版本并不总是正确时，多个 cordova 版本具有不同的规则结构和行为。在我的研究中，我发现这篇文章非常有用https://github.com/jessemonroy650/top-phonegap-mistakes/blob/master/whitelist-matrix.md
• 我的主要问题是“不知道”允许意图覆盖允许导航。确保您了解它的工作原理

Answer 2

如何将www.example.com 加载到 Cordova WebView？

    <allow-navigation href="https://example.com/*" />
    <allow-navigation href="*://*.example.com/*" />

更多信息：

AFAIK，默认情况下 Cordova 不允许在 WebView 上加载外部链接。但是，您仍然可以显示存储在项目中的内部 html 页面（例如 index.html 等）。这是一种安全措施。

因此，您需要安装此插件cordova-plugin-whitelist 并手动将您的应用想要在 Cordova WebView 上加载的域列入白名单。

如果你想让所有的链接在WebView中加载你可以使用<allow-navigation href="*" />但是不推荐。

相关链接：

Official Github link