Lancer une PWA dans une application Android
Les progressive web apps (PWA) sont des applications Web qui utilisent des fonctionnalités semblables à celles des applications pour créer des expériences de haute qualité, rapides, fiables et attrayantes.
Le Web offre une portée incroyable et des moyens efficaces pour les utilisateurs de découvrir de nouvelles expériences. Cependant, les utilisateurs ont également l'habitude de rechercher des applications dans la boutique de leur système d'exploitation. Dans de nombreux cas, ils connaissent déjà la marque ou le service qu'ils recherchent et ont un niveau d'intention élevé, ce qui se traduit par des métriques d'engagement supérieures à la moyenne.
Le Play Store est une boutique d'applications Android. Les développeurs souhaitent souvent ouvrir leurs progressive web apps à partir de leurs applications Android.
Activité Web fiable est une norme ouverte qui permet aux navigateurs de fournir un conteneur entièrement compatible avec la plate-forme Web, qui affiche les PWA dans une application Android. Cette fonctionnalité est disponible dans Chrome et en cours de développement dans Firefox Nightly.
Les solutions existantes étaient limitées
Il a toujours été possible d'inclure des expériences Web dans une application Android à l'aide de technologies telles que Android WebView ou de frameworks tels que Cordova.
La limite d'Android WebView est qu'il n'est pas conçu pour remplacer un navigateur. Android WebView est un outil de développement permettant d'utiliser une interface utilisateur Web dans une application Android. Il ne fournit pas un accès complet aux fonctionnalités modernes de la plate-forme Web, telles que le sélecteur de contacts ou le système de fichiers, entre autres.
Cordova a été conçu pour pallier les insuffisances de WebView, mais les API sont alors limitées à l'environnement Cordova. Cela signifie que vous devez gérer une base de code supplémentaire pour utiliser les API Cordova pour votre application Android, distincte de votre PWA sur le Web ouvert.
De plus, la détection des fonctionnalités ne fonctionne pas toujours comme prévu et les problèmes de compatibilité entre les versions d'Android et les OEM peuvent également poser problème. Lorsque les développeurs utilisent l'une de ces solutions, ils ont besoin de processus d'assurance qualité supplémentaires et doivent supporter des coûts de développement supplémentaires pour détecter et créer des solutions de contournement.
Activité Web fiable est un nouveau conteneur pour les applications Web sur Android
Les développeurs peuvent désormais utiliser une activité Web fiable comme conteneur pour inclure une PWA en tant qu'activité de lancement pour une application Android. Cette technologie exploite le navigateur pour afficher la PWA en plein écran, ce qui garantit que l'activité Web fiable est compatible avec les fonctionnalités et les API de la plate-forme Web du navigateur sous-jacent. Il existe également des utilitaires Open Source pour faciliter l'implémentation d'une application Android à l'aide d'une activité Web fiable.
Un autre avantage non disponible dans d'autres solutions est que le conteneur partage le stockage avec le navigateur. Les états de connexion et les préférences des utilisateurs sont partagés de manière transparente entre les expériences.
Compatibilité du navigateur
Cette fonctionnalité est disponible dans Chrome depuis la version 75, et Firefox l'implémente dans sa version Nightly.
Critères de qualité
Les développeurs Web doivent utiliser une activité Web fiable lorsqu'ils souhaitent inclure du contenu Web dans une application Android.
Le contenu Web d'une activité Web fiable doit répondre aux critères d'installabilité des PWA.
De plus, pour correspondre au comportement attendu des utilisateurs des applications Android, Chrome 86 a introduit une modification selon laquelle le non-traitement des scénarios suivants est considéré comme un plantage :
- Échec de la validation des liens d'actifs numériques au lancement de l'application.
- Échec du renvoi de la réponse HTTP 200 pour une requête de ressource réseau hors connexion.
- Une requête de navigation renvoyant une erreur HTTP 404 ou 5xx.
Lorsque l'un de ces scénarios se produit dans l'activité Web fiable, l'application Android plante et l'utilisateur le voit. Consultez les conseils sur la gestion de ces scénarios dans votre service worker.
L'application doit également répondre à des critères supplémentaires spécifiques à Android, tels que la conformité au règlement.
Outils
Les développeurs Web qui souhaitent profiter de l'activité Web fiable n'ont pas besoin d'apprendre de nouvelles technologies ni de nouvelles API pour transformer leur PWA en application Android. Bubblewrap et PWABuilder fournissent ensemble des outils de développement sous la forme d'une bibliothèque, d'une interface de ligne de commande (CLI) et d'une interface utilisateur graphique (IUG).
Bubblewrap
Le projet Bubblewrap génère des applications Android sous la forme d'une bibliothèque NodeJS et d'une interface de ligne de commande (CLI).
Pour amorcer un nouveau projet, exécutez l'outil et transmettez l'URL du fichier manifeste Web :
npx @bubblewrap/cli init --manifest=https://pwa-directory.appspot.com/manifest.json
L'outil peut également créer le projet. L'exécution de la commande ci-dessous génère une application Android prête à être importée dans le Play Store :
npx @bubblewrap/cli build
Une fois cette commande exécutée, un fichier nommé app-release-signed.apk est disponible dans le répertoire racine du projet. Il s'agit du fichier qui sera importé dans le Play Store.
PWABuilder
PWABuilder aide les développeurs à transformer des sites Web existants en progressive web apps. Il s'intègre également à Bubblewrap pour fournir une interface graphique permettant d'encapsuler ces PWA dans une application Android. L'équipe PWABuilder a publié un excellent article de blog expliquant comment générer une application Android à l'aide de cet outil.
Valider la propriété de la PWA dans l'application Android
Un développeur qui crée une progressive web app de qualité ne souhaite pas qu'un autre développeur crée une application Android avec celle-ci sans son autorisation. Pour éviter cela, l'application Android doit être associée à la progressive web app à l'aide d'un outil appelé Digital Asset Links.
Bubblewrap et PWABuilder gèrent la configuration nécessaire sur l'application Android, mais il reste une dernière étape : ajouter le fichier assetlinks.json à la PWA.
Pour générer ce fichier, les développeurs ont besoin de la signature SHA-256 de la clé utilisée pour signer l'APK téléchargé par les utilisateurs.
La clé peut être générée de plusieurs manières. Le moyen le plus simple de trouver la clé qui a signé l'APK distribué aux utilisateurs finaux consiste à le télécharger depuis le Play Store lui-même.
Pour éviter d'afficher une application défectueuse aux utilisateurs, déployez l'application sur un
canal de test fermé, installez-la sur un appareil de test, puis utilisez l'outil Asset Link de Peter pour
générer le fichier assetlinks.json approprié pour l'application. Mettez le fichier assetlinks.json généré
à disposition à l'adresse /.well-known/assetlinks.json, dans le domaine en cours de validation.
Étapes suivantes
Une progressive web app offre une expérience Web de haute qualité. L'activité Web fiable est une nouvelle façon d'ouvrir ces expériences de haute qualité à partir d'une application Android lorsqu'elles répondent aux critères de qualité minimaux.
Si vous débutez avec les progressive web apps, consultez nos conseils sur la création d'une PWA de qualité. Pour les développeurs qui disposent déjà d'une PWA, utilisez Lighthouse pour vérifier si elle répond aux critères de qualité.
Ensuite, utilisez Bubblewrap ou PWABuilder pour générer l'application Android, importez-la dans un canal de test fermé sur le Play Store et associez-la à la PWA à l'aide de l'outil Asset Link de Peter.
Enfin, déplacez votre application du canal de test fermé vers la production.