Hosting

Abrir enlaces externos dentro de la aplicación en Phonegap


Tutorial para aprender abrir enlaces externos en una aplicación con Phonegap, veremos diferentes maneras para poder abrir enlaces o recursos externos.

En Phonegap existe dos maneras para abrir enlaces externos o también llamados (hipervinculos).

  1. La primera manera para crear un enlace externo es usar el elemento web A de HTM, en la propiedad target de la etiqueta se especifica la forma de su apertura (_self, _blank, _system) le asignamos el valor _system para obligar que el hipervinculo (enlace) cuando sea pulsado por el usuario se abre con el navegador web externo del sistema, o la aplicación asociada al recurso.
    <a href="http://phonegapspain.com" target="_system">Ir a la comunidad Phonegap Spain</a>
  2. La otra forma para crear y abrir un enlace externo es usando el core Plugin Api Inappbrowser de Phonegap. Usando el plugin InAppbrowser podremos abrir los enlaces externos dentro de la aplicación, como si formasen parte de ella.

    En el archivo config.xml indicar la carga del plugin InAppBrowser

    <gap:plugin name="org.apache.cordova.inappbrowser" source="npm"/>

    Se puede también utilizar el elemento web A de Html, en la propiedad target le ponemos el valor _blank, para crear una instancia nueva sobre el webview o bien _self que el recurso web sustituirá el webview principal.
    En la propiedad href se puede incrustar código Javascript, ponemos el siguiente código

    javascript:var ref = window.open('http://tudominio.com/fotografia.jpg', '_blank', 'location=no');

    Para más información y parámetros específicos de cada plataforma, consultar la documentación del plugin Inappbrowser de Phonegap.

Con la función window.open podemos abrir un enlace o recurso externo dentro de la misma app.

Patrones de diseño

Algunos patrones de diseño y comportamiento de aplicaciones usando hipervínculos externos.
  • Abrir una imagen externa dentro de la aplicación, poder hacer zoom con los dedos y desplazarse por ella, simulando un visor de imagen nativo.
  • Crear un sistema de ayuda en linea de la aplicación, que formaría parte de la misma pero actualizada externamente sin ser compilarla de nuevo.

Patrón URI de UrlScheme en los enlaces externos

Se puede especificar un UrlScheme (esquema URL) en el enlace, al hacer click el usuario se abrirá con la aplicación predeterminada del sistema, algunos UrlShceme más comunes entre los sistemas operativos móviles son:

  • http o https: abre el enlace en el navegador web.
  • mailto: abre automáticamente la app de Mail con el destinatario que fuera indicado en el enlace.
  • tel: sugiere al usuario abrir la app de Teléfono para hacer una llamada al número indicado en el enlace.
  • sms: abre automáticamente la app Mensajes con el destinatario cumplimentado con la información del número de teléfono del enlace.
  • geo: abre la app associada a posicionar una localización GPS en un mapa.
Las aplicaciones pueden crear y personalizar sus propios (UrlScheme) o bien asignar un patrón del esquema de la url, como por ejemplo la aplicación Youtube: los enlaces que contengan http://www.youtube.com/watch?v=: se abre con la app de Youtube con el video indicado.

Para más información sobre URI Schemes comúnes y de aplicaciones de terceros.


Frases para búsqueda interna
- open link in browser
- how to open external url in device browser on Android?
- How to open any external link with InAppBrowser
- Enlaces externos en App con PhoneGap
- Acceso a recursos externos con PhoneGap/Cordova
SHARE
    Blogger Comment
    Facebook Comment

0 comentarios:

Publicar un comentario