在webview中打开url – phonegap

我想知道如何在embeddedwebview的应用程序上下文中打开一个url。 目前这个演示将在外部浏览器中打开一个新的标签,所以,不是我所期望的。 我正在使用google.com进行testing。

总结,我正在寻找一个function演示。

<?xml version="1.0" encoding="UTF-8"?> <!-- config.xml reference: https://build.phonegap.com/docs/config-xml --> <widget xmlns = "http://www.w3.org/ns/widgets" xmlns:gap = "http://phonegap.com/ns/1.0" xmlns:android = "http://schemas.android.com/apk/res/android" id = "com.xxx.xxxxx" version = "1.0.0"> <preference name="stay-in-webview" value="true" /> <access origin="*" browserOnly="true" subdomains="true" /> <content src="index.html" /> <allow-navigation href="https://google.com/*" /> <gap:plugin name="cordova-plugin-whitelist" source="npm" version="~1" /> <gap:plugin name="org.apache.cordova.inappbrowser" /> <gap:plugin name="org.apache.cordova.splashscreen" /> <preference name="phonegap-version" value="cli-5.4.1" /> <preference name="permissions" value="none"/> <preference name="target-device" value="universal"/> <preference name="fullscreen" value="true"/> </widget> 

 <!DOCTYPE html> <html> <head> <link rel="stylesheet" type="text/css" href="css/index.css" /> </head> <body> <div> <script type="text/javascript" charset="utf-8"> document.addEventListener("deviceready", onDeviceReady, false); function onDeviceReady() { window.location.href = 'https://google.com'; } </script> </div> <script type="text/javascript" src="cordova.js"></script> </body> </html> 

更新:完整的xml文件: https : //codeshare.io/Vw3Fl

Solutions Collecting From Web of "在webview中打开url – phonegap"

尝试:

 window.open('https://google.com', '_self ', 'location=yes'); 

代替 :

 window.location.href = 'https://google.com'; 

这将使用InAppBrowser,并使用_self作为目标。

您必须在config.xml中添加此行以允许导航到外部URL

 <allow-navigation href="*" /> 

这将允许导航到任何外部url,如果你只是想让导航到谷歌然后添加这一行

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

您可以在插件页面上查看其他文档

https://github.com/apache/cordova-plugin-whitelist

您可能需要将以下内容添加到phonegap xml文件中:

 <?xml version="1.0" encoding="UTF-8"?> <phonegap> <access origin="https://abcx.com" subdomains="true" /> </phonegap> 

在phonegap应用程序的系统浏览器中打开页面的一个非常简单的方法是通过在iframe中呈现该页面。

 <iframe src="http://www.google.com></iframe> 

您可以使用dom更新来更改iframe中的url。

这将加载到本地系统浏览器的页面中。

对于那些在使用Phonegap 6.3.1时遇到这个问题的人,您应该正确地将url列入白名单,并使用cordova-plugin-inappbrowser插件 。

阅读如何做到这一点。


首先,确保您已将您想要打开的url列入白名单。 您可以通过将它们添加到项目根目录下的config.xml文件中的<access>标记, <allow-intent>标记和allow-navigation标记的hrefs来完成。 一些谎言:

 <?xml version='1.0' encoding='utf-8'?> <widget id="com.phonegap.helloworld" version="1.0.0" xmlns="http://www.w3.org/ns/widgets" xmlns:gap="http://phonegap.com/ns/1.0"> ... <access origin="*" /> <allow-intent href="*" /> <allow-navigation href="*" /> ... </widget> 

(注意:上述hrefs中的“*”允许打开任何url /path,在生产中,你可能想要限制某些url /path)

接下来,在您的index.html文件中添加以下javascript:

 <script type="text/javascript"> document.addEventListener('deviceready', function() { var url = 'https://www.google.com' // change to whatever you want cordova.InAppBrowser.open(url, '_self', 'location=no'); }, false) </script> 

该脚本使用cordova-plugin-inappbrowser插件,如果使用标准Phonegap模板生成应用程序,则该插件应该已经包含在config.xml文件中。

脚本等待设备准备就绪,然后使用cordova-plugin-inappbrowser插件打开给定的url。 '_self'参数意味着它在Phonegap webview中打开页面, 'location=no'表示不会有地址栏。 有关其他参数选项,请参阅cordova-plugin-inappbrowser插件的文档(上面的链接)。

最后,要在相应的模拟器中testing应用程序(假设您已经安装了Phonegap CLI ),请运行以下命令:

 phonegap run ios --verbose --stack-trace phonegap run android --verbose --stack-trace