Avviare una PWA in un'app per Android
Le app web progressive (PWA) sono applicazioni web che utilizzano funzionalità simili a quelle delle app per creare esperienze di alta qualità veloci, affidabili e coinvolgenti.
Il web ha una copertura incredibile e offre agli utenti modi efficaci per scoprire nuove esperienze. Ma gli utenti sono anche abituati a cercare applicazioni nello store del loro sistema operativo. In molti casi, questi utenti hanno già familiarità con il brand o il servizio che cercano e hanno un elevato livello di intenzionalità che si traduce in metriche sul coinvolgimento superiori alla media.
Il Play Store è uno store per le app Android e gli sviluppatori spesso vogliono aprire le app web progressive dalle app Android.
Attività web attendibile è uno standard aperto che consente ai browser di fornire un contenitore completamente compatibile con la piattaforma web che esegue il rendering delle PWA all'interno di un'app per Android. La funzionalità è disponibile in Chrome e in fase di sviluppo in Firefox Nightly.
Le soluzioni esistenti erano limitate
È sempre stato possibile includere le esperienze web in un'app per Android utilizzando tecnologie come Android WebView o framework come Cordova.
Il limite di Android WebView è che non è pensato come sostituto del browser. Android WebView è uno strumento per sviluppatori che consente di utilizzare la UI web in un'app per Android e non fornisce l'accesso completo alle funzionalità moderne delle piattaforme web, come il selettore contatti o il file system, tra le altre.
Cordova è stata progettata per aumentare le carenze di WebView, ma le API sono quindi limitate all'ambiente Cordova. Ciò significa che devi mantenere un codebase aggiuntivo per l'utilizzo delle API Cordova per la tua app per Android, separato dalla tua PWA sul web aperto.
Inoltre, la rilevabilità delle funzionalità spesso non funziona come previsto e anche i problemi di compatibilità tra le versioni Android e gli OEM possono rappresentare un problema. Quando utilizzano una di queste soluzioni, gli sviluppatori hanno bisogno di ulteriori processi di controllo qualità e comportano un costo di sviluppo aggiuntivo per rilevare e creare soluzioni alternative.
Attività web attendibile è un nuovo contenitore per le app web su Android
Ora gli sviluppatori possono utilizzare un'attività web attendibile come contenitore per includere una PWA come attività di avvio di un'app per Android. La tecnologia utilizza il browser per visualizzare la PWA a schermo intero, garantendo che l'Attività web attendibile abbia la stessa compatibilità con le funzionalità e le API della piattaforma web del browser sottostante. Esistono anche utilità open source che rendono ancora più facile l'implementazione di un'app Android tramite un'attività web attendibile.
Un altro vantaggio non disponibile in altre soluzioni è che il container condivide lo spazio di archiviazione con il browser. Gli stati di accesso e le preferenze degli utenti vengono condivisi senza soluzione di continuità tra le esperienze.
Compatibilità dei browser
La funzionalità è disponibile in Chrome dalla versione 75 e Firefox la implementa nella versione notturna.
Criteri di qualità
Gli sviluppatori web dovrebbero utilizzare un'attività web attendibile quando vogliono includere contenuti web in un'app per Android.
I contenuti web di un'attività web attendibile devono soddisfare i criteri di installabilità delle PWA.
Inoltre, per adeguarsi al comportamento che gli utenti si aspettano dalle applicazioni per Android, Chrome 86 ha introdotto una modifica per cui la mancata gestione dei seguenti scenari viene considerata un arresto anomalo:
- Mancata verifica dei link agli asset digitali al momento del lancio dell'applicazione.
- Impossibile restituire HTTP 200 per una richiesta di risorsa di rete offline.
- Una richiesta di navigazione che restituisce un errore HTTP 404 o 5xx".
Quando si verifica uno di questi scenari nell'Attività web attendibile, l'app Android ha un arresto anomalo visibile per l'utente. Consulta le linee guida sulla gestione di questi scenari nel tuo service worker.
L'applicazione deve inoltre soddisfare criteri aggiuntivi specifici di Android, come la conformità alle norme.
Utensili
Gli sviluppatori web che desiderano sfruttare l'Attività web attendibile non hanno bisogno di apprendere nuove tecnologie o API per trasformare la loro PWA in un'applicazione Android. Insieme, Bubblewrap e PWABuilder forniscono strumenti agli sviluppatori sotto forma di libreria, interfaccia a riga di comando (CLI) e interfaccia utente grafica (GUI).
Carta da imballaggio
Il progetto Bubblewrap genera app Android sotto forma di libreria NodeJS e di interfaccia a riga di comando (CLI).
Il bootstrap di un nuovo progetto si ottiene eseguendo lo strumento e passando l'URL del manifest web:
npx @bubblewrap/cli init --manifest=https://pwa-directory.appspot.com/manifest.json
Lo strumento può anche creare il progetto ed eseguire il comando seguente restituirà un'applicazione Android pronta per essere caricata nel Play Store:
npx @bubblewrap/cli build
Dopo aver eseguito questo comando, un file denominato app-release-signed.apk sarà disponibile nella directory principale del progetto. Questo è il file che verrà caricato sul Play Store.
PWABuilder
PWABuilder aiuta gli sviluppatori a trasformare i siti web esistenti in app web progressive. Inoltre, si integra con Bubblewrap per fornire un'interfaccia GUI per l'aggregazione delle PWA in un'app per Android. Il team di PWABuilder ha pubblicato un ottimo post del blog su come generare un'applicazione Android utilizzando lo strumento.
Verificare la proprietà della PWA nell'app per Android
Uno sviluppatore che crea un'ottima app web progressiva non vorrebbe che un altro sviluppatore creasse un'app Android con questa app senza la sua autorizzazione. Per evitare che ciò accada, l'applicazione Android deve essere accoppiata all'app web progressiva utilizzando uno strumento chiamato Digital Asset Links.
Bubblewrap e PWABuilder si occupano della configurazione necessaria nell'applicazione Android, ma rimane un ultimo passaggio: aggiungere il file assetlinks.json alla PWA.
Per generare questo file, gli sviluppatori devono avere la firma SHA-256 della chiave utilizzata per firmare l'APK che viene scaricato dagli utenti.
La chiave può essere generata in diversi modi e il modo più semplice per trovare la chiave che firma l'APK fornito agli utenti finali è scaricarla dal Play Store stesso.
Per evitare di mostrare agli utenti un'applicazione non funzionante, esegui il deployment dell'applicazione in un canale di test chiuso, installala in un dispositivo di test, quindi utilizza lo strumento Asset Link di Pietro per generare il file assetlinks.json corretto per l'app. Rendi disponibile il file assetlinks.json generato su /.well-known/assetlinks.json, nel dominio da convalidare.
Passaggi successivi
Un'app web progressiva è un'esperienza web di alta qualità. Attività web attendibile è un nuovo modo per offrire esperienze di alta qualità da un'app Android quando soddisfano i criteri di qualità minimi.
Se stai iniziando a utilizzare le app web progressive, leggi le nostre indicazioni su come creare una fantastica PWA. Gli sviluppatori che hanno già una PWA possono usare Lighthouse per verificare se soddisfa i criteri di qualità.
Quindi, utilizza Bubblewrap o PWABuilder per generare l'applicazione Android, caricala su un canale di test chiuso sul Play Store e accoppiala con la PWA utilizzando lo strumento Asset Link di Pietro.
Infine, sposta la tua applicazione dal canale di test chiuso alla produzione.