Abrir url en la vista web – phonegap
Me gustaría saber cómo puedo abrir una url en el contexto de la aplicación de incrustar webview. Actualmente esta demo abrirá una nueva pestaña en el navegador externo, así que no es lo que espero. Estoy usando google.com solo para probar.
Resumen, Estoy buscando una demo funcional.
- ¿Cómo detener el video de YouTube en la vista web de Android?
- Android: mantenimiento de la API SCORM entre dos webviews
- Cómo deshabilitar el teclado virtual en WebView
- XML Splash Screen -> Mostrar la Webview
- Cómo encontrar la animación ha terminado de jugar en android
<?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>
Actualización: Archivo xml completo: https://codeshare.io/Vw3Fl
- Android Talkback no lee caracteres utf-8 en la vista Web usando html
- Cómo poblar webview en android con texto sin formato de base de datos y ser capaz de manejar caracteres de nueva línea
- WebView OverScroll
- Utilice una barra de acción contextual personalizada para la selección de texto de WebView
- Escáner de código de barras ZXing para Webapps
- Cómo establecer un título diferente para el cuadro de diálogo de alerta cuando se carga la página WebView?
- cómo mostrar la vista web como OverviewMode (completamente alejado) en android? ¿cómo?
- En el enlace del navegador de Android no siempre se ejecuta onClick causando el foco en su lugar
tratar :
window.open('https://google.com', '_self ', 'location=yes');
en lugar de :
window.location.href = 'https://google.com';
Esto utilizará InAppBrowser y utilizará _self como destino.
Debe agregar esta línea en el config.xml para permitir la navegación a urls externas
<allow-navigation href="*" />
Esto permitirá la navegación a cualquier URL externa, si sólo desea permitir la navegación a google, a continuación, agregue esta línea
<allow-navigation href="https://google.com" />
Puede consultar el resto de la documentación en la página del complemento
Es posible que tenga que agregar lo siguiente a su archivo xml de phonegap:
<?xml version="1.0" encoding="UTF-8"?> <phonegap> <access origin="https://abcx.com" subdomains="true" /> </phonegap>
Una forma muy sencilla de abrir la página en el navegador del sistema en una aplicación de separación telefónica es mediante la representación de esa página en un iframe.
<iframe src="http://www.google.com></iframe>
Puede cambiar la URL en el iframe mediante dom update.
Esto se cargará en la página en el navegador del sistema nativo.
Para aquellos que tienen este problema mientras se utiliza Phonegap 6.3.1, debe whitelist las urls correctamente y utilizar el complemento cordova-plugin-inappbrowser .
Siga leyendo para saber cómo hacer esto.
En primer lugar, asegúrese de que ha incluido en la lista blanca las URL que desea abrir. Para ello, añádalos a las hrefs de <access>
etiquetas <access>
, <allow-intent>
y las etiquetas allow-navigation
en el archivo config.xml en la raíz del proyecto. Algo parecido a:
<?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>
(Nota: el "*" en el anterior hrefs permite la apertura de cualquier url / path.En la producción, es probable que desee restringir a ciertas urls / caminos)
A continuación, en su archivo index.html, agregue el siguiente 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>
Este script utiliza el complemento cordova-plugin-inappbrowser, que, si generó su aplicación usando la plantilla estándar de Phonegap, ya debería estar incluido en su archivo config.xml.
El script espera que el dispositivo esté listo, luego usa el plugin cordova-plugin-inappbrowser para abrir la url dada. El parámetro '_self'
significa que abre la página en la vista web Phonegap y la 'location=no'
significa que no habrá barra de direcciones. Para otras opciones de parámetros, consulte la documentación del complemento cordova-plugin-inappbrowser (enlace anterior).
Por último, para probar la aplicación en los emuladores adecuados (suponiendo que tenga instalada la CLI de Phonegap ), ejecute los siguientes comandos:
phonegap run ios --verbose --stack-trace phonegap run android --verbose --stack-trace
- Ffmpeg 10.04 no pudo encontrar parámetros de codec
- Obtener "Aplicación desconocida ABI" al intentar depurar código C en mi aplicación de Android