Actividad web confiable

Cómo validar su aplicación web y crear una aplicación para Android a partir de ella

¿Confías en mí?

Desde hace algún tiempo, las aplicaciones web se pueden transformar en una aplicación nativa con poco esfuerzo, dependiendo de la complejidad de la aplicación. Por ejemplo, marcos como Capacitor.js o Cordova ofrecen dicha funcionalidad y también son software de código abierto. Para ofrecer una aplicación web como nativa, debe compilar la aplicación web localmente, indicarle al marco dónde se encuentra esta salida de compilación y, básicamente, esperar hasta que se creen las aplicaciones. El concepto central es que su sitio web simplemente se ejecuta en una vista web incorporada. Bueno, las cosas están a punto de cambiar ahora una vez más con la introducción de "Actividad web confiable" de Google.

PWA ++

¿Qué es la “actividad web confiable” (TWA)? Aquí está la esencia:

  • Una "Actividad web de confianza" se utiliza en el contexto de Google Play Store y una aplicación nativa de Android generada a partir de una PWA.
  • Puede verificar la propiedad de su PWA para la aplicación de Android creando una credencial llamada "assetlinks"; aquí es donde se necesita Google Play
  • Al cargar este archivo "assetlinks" en el directorio público de su aplicación web, Google puede verificar la propiedad de la PWA cuando la aplicación nativa de Android obtiene, por lo que nadie más que usted puede crearla.

Muy bien, esta fue una breve descripción general del concepto detrás de TWA. En resumen, la parte de "confianza" se relaciona con la verificación de la propiedad de su PWA.

¡Un nuevo TWA, por favor!

Ok, pero ¿cómo funciona realmente? La configuración es realmente sencilla y no debería llevar más de una hora. Así es como se hace:

Primero, asegúrese de que su PWA esté configurada correctamente:

  • manifest.json está disponible y validado
  • icono + nombre son correctos
  • puede comprobar estos cambios rápidamente en DevTools

La biblioteca principal que se encargará de todo el trabajo pesado se llama "bubblewrap", un paquete de Node.js que ofrece una CLI, que se utilizará a lo largo del tutorial.

Primero, cree un nuevo directorio para el TWA llamado "twa". Dentro de "twa" crearemos un directorio más llamado "android". "Twa" en sí mismo contendrá los node_modules y "android" la aplicación nativa de Android real.

Asegúrese de estar ahora dentro de "twa" para iniciar un nuevo proyecto npm:

npm init -y

Ahora agreguemos la CLI como una dependencia de desarrollo:

npm i -D @bubblewrap/cli

Eso es todo lo que necesitamos por ahora. Entonces, iniciemos el proyecto "bubblewrap". Simplemente reemplace el dominio con el suyo y verifique dónde se encuentra "manifest.json". Se le solicitarán las ubicaciones del SDK de Java + SDK de Android, que puede reutilizar si ya están instaladas:

npx bubblewrap init --manifest=https://your-pwa.com/manifest.json

Continuando, es hora de revisar algunas preguntas y respuestas con la CLI de "bubblewrap". Dependiendo de los metadatos disponibles en su PWA, la mayoría de los campos ya estarán prellenados:

npx bubblewrap build

Ahora que se identificó su PWA y se creó la aplicación de Android, es hora de realizar una prueba rápida de humo. Inicie un emulador o use su dispositivo real de prueba de su elección:

npx bubblewrap install

Si todo funciona bien, verá su aplicación web como una aplicación nativa de Android que funciona. Genial, ¡la parte más difícil ya está hecha!

Lo que queda es la creación del archivo de verificación llamado "assetlinks.json". Como supongo que desea cargar el paquete de la aplicación en Google Play, es importante tener en cuenta cómo se administra realmente la firma:

  • Google Play administrará las claves de firma por usted, lo que significa que tenemos que buscar el valor SHA-256 correspondiente en Google Play Console.
  • "Bubblewrap" podría haber creado un "assetlinks" - archivo que ya tiene una entrada, que contiene un hash SHA-256 diferente - no se preocupe, usaremos ambas claves de Google Play y la generada

Si no se ha creado ningún archivo de "enlaces de activos", la forma en que procedí fue descargar la "Herramienta de enlaces de activos" (recomendada por Google, enlace en el apéndice) en mi dispositivo de prueba y leer el SHA-256 de la aplicación de prueba firmada instalada y creada y instalado por "bubblewrap". Este json puede ser utilizado por usted. Solo asegúrese de duplicar la primera entrada y reemplazar el SHA-256 con el de Google Play, lo que da como resultado un archivo de "enlaces de activos" con 2 entradas, que solo difieren en sus claves de firma.

Casi terminado, ahora solo tiene que crear un nuevo directorio en la carpeta pública de su PWA existente y cargar la aplicación una vez:

.well-known/assetlinks.json

Ahora Google puede leerlo y verificar la propiedad.

Un paso más...

Todo lo que queda ahora es subir el paquete de lanzamiento a Google Play y lanzarlo. Sí, en realidad es así de simple. Google realmente impulsa lo que es posible en la Web y no tiene miedo de probar cosas nuevas. La "actividad web confiable" es una nueva forma de cerrar aún más la brecha entre la web y la tecnología nativa, aunque actualmente se limita a Android.

Ah, y sí: por supuesto, esta aplicación web es una PWA y una TWA. Puede consultar la aplicación de Android en Google Play, el enlace se encuentra a continuación en el apéndice.

  • Tom