Avvia 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. Tuttavia, gli utenti sono anche abituati a cercare le applicazioni nello store del loro sistema operativo. In molti casi, questi utenti conoscono già il brand o il servizio che stanno cercando e hanno un livello elevato di intenzionalità che si traduce in metriche sul coinvolgimento superiori alla media.
Il Play Store è uno store di app per Android e gli sviluppatori spesso vogliono aprire le loro app web progressive dalle loro app per Android.
L'Attività web attendibile è uno standard aperto che consente ai browser di fornire un container completamente compatibile con la piattaforma web che esegue il rendering delle PWA all'interno di un'app per Android. La funzionalità è disponibile in Chrome ed è in fase di sviluppo in Firefox Nightly.
Le soluzioni esistenti erano limitate
È sempre stato possibile includere esperienze web in un'app per Android, utilizzando tecnologie come Android WebView o framework come Cordova.
La limitazione di Android WebView è che non è destinato a sostituire il browser. Android WebView è uno strumento per sviluppatori che consente di utilizzare l'interfaccia utente web in un'app per Android e non fornisce l'accesso completo alle funzionalità della piattaforma web moderna, come il selettore di contatti o il file system, tra le altre.
Cordova è stato progettato per compensare le carenze di WebView, ma le API sono 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 PWA sul web aperto.
Inoltre, la rilevabilità delle funzionalità spesso non funziona come previsto e i problemi di compatibilità tra le versioni di Android e gli OEM possono essere un problema. Quando utilizzano una di queste soluzioni, gli sviluppatori hanno bisogno di processi di garanzia di qualità aggiuntivi e devono sostenere un costo di sviluppo extra per rilevare e creare soluzioni alternative.
L'Attività web attendibile è un nuovo contenitore per le app web su Android
Ora gli sviluppatori possono utilizzare un'Attività web attendibile come container per includere una PWA come attività di avvio per un'app per Android. La tecnologia sfrutta il browser per eseguire il rendering della 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 per semplificare ulteriormente l'implementazione di un'app per Android utilizzando 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 problemi tra le esperienze.
Compatibilità del browser
La funzionalità è disponibile in Chrome dalla versione 75, mentre Firefox la implementa nella sua versione Nightly.
Criteri di qualità
Gli sviluppatori web devono utilizzare un'Attività web attendibile quando vogliono includere contenuti web in un'app per Android.
I contenuti web in un'Attività web attendibile devono soddisfare i criteri di installabilità delle PWA.
Inoltre, per corrispondere al comportamento che gli utenti si aspettano dalle app per Android, Chrome 86 ha introdotto una modifica per cui la mancata gestione dei seguenti scenari è considerata un arresto anomalo:
- Mancata verifica dei link agli asset digitali al momento del lancio dell'applicazione.
- Mancata restituzione del codice HTTP 200 per una richiesta di risorsa di rete offline.
- Una richiesta di navigazione che restituisce un errore HTTP 404 o 5xx".
Quando uno di questi scenari si verifica nell'Attività web attendibile, l'app per Android si arresta in modo anomalo visibile all'utente. Consulta le indicazioni su come gestire questi scenari nel tuo service worker.
L'applicazione deve inoltre soddisfare criteri aggiuntivi specifici per Android, come la conformità alle norme.
Strumenti
Gli sviluppatori web che vogliono sfruttare l'Attività web attendibile non devono imparare nuove tecnologie o API per trasformare la loro PWA in un'app per Android. Insieme, Bubblewrap e PWABuilder forniscono strumenti per sviluppatori sotto forma di libreria, interfaccia a riga di comando (CLI) e Graphic User Interface (GUI).
Pluriball
Il progetto Bubblewrap genera app per Android sotto forma di libreria NodeJS e interfaccia a riga di comando (CLI).
Per eseguire il bootstrap di un nuovo progetto, esegui lo strumento e passa l'URL del manifest web:
npx @bubblewrap/cli init --manifest=https://pwa-directory.appspot.com/manifest.json
Lo strumento può anche creare il progetto. L'esecuzione del comando seguente genererà un'app per Android pronta per essere caricata sul Play Store:
npx @bubblewrap/cli build
Dopo aver eseguito questo comando, nella directory principale del progetto sarà disponibile un file denominato app-release-signed.apk. 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 eseguire il wrapping di queste PWA in un'app per Android. Il team di PWABuilder ha messo insieme un ottimo blog post su come generare un'applicazione per Android utilizzando lo strumento.
Verifica della 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 per Android con la sua 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'app per Android, ma
manca un ultimo passaggio, ovvero l'aggiunta del file assetlinks.json alla PWA.
Per generare questo file, gli sviluppatori hanno bisogno della 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 ha firmato 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 e poi utilizza lo strumento Peter's Asset Link Tool per generare il file assetlinks.json corretto per l'app. Rendi disponibile il file assetlinks.json generato all'indirizzo /.well-known/assetlinks.json, nel dominio in fase di convalida.
Passaggi successivi
Un'app web progressiva è un'esperienza web di alta qualità. L'Attività web attendibile è un nuovo modo per aprire queste esperienze di alta qualità da un'app per 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 PWA di qualità. Se hai già una PWA, utilizza Lighthouse per verificare se soddisfa i criteri di qualità.
Poi, utilizza Bubblewrap o PWABuilder per generare l'applicazione Android, carica l'applicazione su un canale di test chiuso sul Play Store e associala alla PWA utilizzando Peter's Asset Link Tool.
Infine, sposta l'applicazione dal canale di test chiuso alla produzione.