Cordova/Phonegap在主要的Cordova网络视图中加载外部站点

Cordova/Phonegap load external site in main Cordova webview

本文关键字：Cordova 视图 加载 站点 外部 网络 Phonegap      更新时间：2023-09-26

我想要什么

我有外部网络资源，我希望cordova网络视图能够简单地打开，并能够在其内部导航中导航。

描述

InAppBrowser文档称

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

所以我有一个值得信赖的外部链接（比如http://www.google.com我想在主web视图中加载，并希望通过window.location.htm或用户链接单击来控制其进程。

我尝试了什么

使用最新的cordova生成helloworld应用程序并插入

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

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

<access origin="*" />

我也尝试了window.open和手动用户点击链接，但我所得到的只是在外部浏览器中打开链接的对话框，而不是在同一个网络视图中呈现它。我还尝试了InAppBrowser扩展，当我禁用导航栏时，它可以很好地工作，但它存在通信问题，并且在手动链接点击和window.location.href更改时不起作用。

在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
  • 我的主要问题是"不知道"允许意图覆盖允许导航。确保您了解它的工作原理

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

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

更多信息：

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

因此，您需要安装此插件cordova插件白名单，并手动将您的应用程序要加载到cordova WebView上的域列入白名单。

如果要允许在WebView中加载所有链接，可以使用<allow-navigation href="*" />，但不建议使用。

相关链接：

官方Github链接

相关文章：