Cómo iniciar una AWP en una app para Android
Las apps web progresivas (AWP) son aplicaciones web que usan funciones similares a las de las apps para crear experiencias de alta calidad que sean rápidas, confiables y atractivas.
La Web tiene un alcance increíble y ofrece formas eficaces para que los usuarios descubran experiencias nuevas. Sin embargo, los usuarios también están acostumbrados a buscar aplicaciones en la tienda de su sistema operativo. En muchos casos, esos usuarios ya están familiarizados con la marca o el servicio que buscan y tienen un alto nivel de intención que genera métricas de participación más altas que el promedio.
Play Store es una tienda de apps para Android, y los desarrolladores suelen querer abrir sus apps web progresivas desde sus apps para Android.
La actividad web confiable es un estándar abierto que permite que los navegadores proporcionen un contenedor compatible con la plataforma web que renderiza AWP dentro de una app para Android. La función está disponible en Chrome y en desarrollo en Firefox Nightly.
Las soluciones existentes eran limitadas.
Siempre fue posible incluir experiencias web en una app para Android con tecnologías como WebView de Android o frameworks como Cordova.
La limitación de Android WebView es que no está diseñado para reemplazar un navegador. Android WebView es una herramienta para desarrolladores que permite usar la IU web en una app para Android y no proporciona acceso completo a las funciones modernas de la plataforma web, como el selector de contactos o el sistema de archivos, entre otros.
Cordova se diseñó para aumentar las deficiencias de WebView, pero las APIs se limitan al entorno de Cordova. Esto significa que debes mantener una base de código adicional para usar las APIs de Cordova en tu app para Android, separada de la AWP de la Web abierta.
Además, la visibilidad de funciones a menudo no siempre funciona como se espera, y los problemas de compatibilidad entre las versiones de Android y los OEM también pueden ser un problema. Cuando se usa una de esas soluciones, los desarrolladores necesitan procesos adicionales de control de calidad y, además, incurren en costos de desarrollo adicionales para detectar y crear soluciones alternativas.
La Actividad web de confianza es un nuevo contenedor para apps web en Android
Los desarrolladores ahora pueden usar una Actividad web de confianza como contenedor para incluir una AWP como actividad de inicio de una app para Android. La tecnología aprovecha el navegador para renderizar la AWP en pantalla completa, lo que garantiza que la Actividad web de confianza tenga la misma compatibilidad con las funciones y las APIs de la plataforma web que el navegador subyacente. También hay utilidades de código abierto para facilitar aún más la implementación de una app para Android con una Actividad web de confianza.
Otra ventaja que no está disponible en otras soluciones es que el contenedor comparte el almacenamiento con el navegador. Los estados de acceso y las preferencias de los usuarios se comparten sin problemas entre las experiencias.
Compatibilidad del navegador
La función está disponible en Chrome desde la versión 75, y Firefox la implementó en su versión nocturna.
Criterios de calidad
Los desarrolladores web deben usar una Actividad web de confianza cuando quieran incluir contenido web en una app para Android.
El contenido web de una actividad web de confianza debe cumplir con los criterios de instalabilidad de la AWP.
Además, para que coincida con el comportamiento que los usuarios esperan de las aplicaciones para Android, Chrome 86 introdujo un cambio en el que no se controlan las siguientes situaciones, lo que se considera una falla:
- No se pudieron verificar los vínculos de recursos digitales en el inicio de la aplicación.
- No se muestra el código HTTP 200 para una solicitud de recurso de red sin conexión.
- Una solicitud de navegación que muestra un error HTTP 404 o 5xx".
Cuando ocurre una de esas situaciones en la Actividad web confiable, se produce una falla visible para el usuario de la aplicación para Android. Consulta la guía para controlar esas situaciones en tu trabajador de servicio.
La aplicación también debe cumplir con criterios adicionales específicos de Android, como el cumplimiento de las políticas.
Herramientas
Los desarrolladores web que quieran aprovechar la Actividad web de confianza no necesitan aprender nuevas tecnologías ni APIs para transformar su AWP en una aplicación para Android. Juntos, Bubblewrap y PWABuilder proporcionan herramientas para desarrolladores en forma de biblioteca, interfaz de línea de comandos (CLI) e interfaz gráfica de usuario (GUI).
Papel de burbujas
El proyecto Bubblewrap genera apps para Android en forma de biblioteca NodeJS y una interfaz de línea de comandos (CLI).
Para iniciar un proyecto nuevo, ejecuta la herramienta y pasa la URL del manifiesto web:
npx @bubblewrap/cli init --manifest=https://pwa-directory.appspot.com/manifest.json
La herramienta también puede compilar el proyecto. Si ejecutas el siguiente comando, se mostrará una aplicación para Android lista para subirla a Play Store:
npx @bubblewrap/cli build
Después de ejecutar este comando, un archivo llamado app-release-signed.apk estará disponible en el directorio raíz del proyecto. Este es el archivo que se subirá a Play Store.
PWABuilder
PWABuilder ayuda a los desarrolladores a transformar sitios web existentes en apps web progresivas. También se integra con Bubblewrap para proporcionar una interfaz de GUI que une esas AWP en una app para Android. El equipo de PWABuilder compiló una excelente entrada de blog sobre cómo generar una aplicación para Android con la herramienta.
Cómo verificar la propiedad de la AWP en la app para Android
Un desarrollador que crea una excelente app web progresiva no querría que otro lo creara con ella sin su permiso. Para garantizar que esto no suceda, la aplicación para Android debe vincularse con la app web progresiva con una herramienta llamada Vínculos de recursos digitales.
Bubblewrap y PWABuilder se encargan de la configuración necesaria en la aplicación para Android, pero queda un último paso: agregar el archivo assetlinks.json a la AWP.
Para generar este archivo, los desarrolladores necesitan la firma SHA-256 de la clave que se usa para firmar el APK que descargan los usuarios.
La clave se puede generar de varias maneras, y la forma más fácil de encontrar la clave que firmó el APK que se entrega a los usuarios finales es descargarlo desde Play Store.
Para evitar mostrar una aplicación dañada a los usuarios, implementa la aplicación en un canal de prueba cerrado, instálala en un dispositivo de prueba y, luego, usa la herramienta de vinculación de recursos de Peter para generar el archivo assetlinks.json correcto para la app. Haz que el archivo assetlinks.json generado esté disponible en /.well-known/assetlinks.json, en el dominio que se está validando.
Próximos pasos
Una Progressive Web App es una experiencia web de alta calidad. La actividad web de confianza es una nueva forma de abrir esas experiencias de alta calidad desde una app para Android cuando cumplen con los criterios de calidad mínimos.
Si te estás iniciando en las apps web progresivas, lee nuestra guía para crear una AWP excelente. En el caso de los desarrolladores que ya tienen una AWP, usa Lighthouse para verificar si cumple con los criterios de calidad.
Luego, usa Bubblewrap o PWABuilder para generar la aplicación para Android, subirla a un canal de prueba cerrado en Play Store y vincularla con la AWP con la herramienta de vinculación de recursos de Peter.
Por último, mueve tu aplicación del canal de pruebas cerradas a producción.