Démarrer 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 de découvrir de nouvelles expériences. Toutefois, les utilisateurs ont également l'habitude de rechercher des applications dans le store de leur système d'exploitation. Dans de nombreux cas, ces utilisateurs connaissent déjà la marque ou le service qu'ils recherchent et ont un niveau d'intentionnalité élevé, ce qui se traduit par des métriques d'engagement supérieures à la moyenne.
Le Play Store est un magasin d'applications Android, et les développeurs souhaitent souvent ouvrir leurs progressive web apps à partir de leurs applications Android.
L'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 comme Cordova.
La limite d'Android WebView est qu'il n'est pas destiné à remplacer un navigateur. Android WebView est un outil pour les développeurs qui permet d'utiliser l'UI Web dans une application Android. Il ne fournit pas un accès complet aux fonctionnalités de la plate-forme Web moderne, telles que le sélecteur de contacts ou le système de fichiers, entre autres.
Cordova a été conçu pour pallier les lacunes de WebView, mais les API sont alors limitées à l'environnement Cordova. Cela signifie que vous devez gérer un codebase supplémentaire pour utiliser les API Cordova pour votre application Android, distinct de votre PWA sur le Web ouvert.
De plus, la visibilité 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. Lorsqu'ils utilisent l'une de ces solutions, les développeurs 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.
L'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, tout comme le navigateur sous-jacent. Il existe également des utilitaires Open Source qui facilitent encore plus 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 l'espace de stockage avec le navigateur. Les états de connexion et les préférences des utilisateurs sont partagés de manière fluide 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 nocturne.
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'installation des PWA.
De plus, pour correspondre au comportement attendu par les utilisateurs des applications Android, Chrome 86 a introduit une modification selon laquelle l'échec de la gestion des scénarios suivants est considéré comme un plantage :
- Échec de la validation des liens vers des éléments numériques au lancement de l'application.
- Échec du renvoi du code 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 de manière visible pour l'utilisateur. Consultez les conseils pour gérer ces scénarios dans votre service worker.
L'application doit également répondre à des critères supplémentaires spécifiques à Android, tels que le respect des règles.
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. Ensemble, Bubblewrap et PWABuilder fournissent des outils pour les développeurs 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 compiler le projet. L'exécution de la commande ci-dessous génère une application Android prête à être importée sur le Play Store :
npx @bubblewrap/cli build
Après avoir exécuté cette commande, un fichier nommé app-release-signed.apk sera disponible dans le répertoire racine du projet. Il s'agit du fichier qui sera importé sur 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 utilisateur graphique permettant d'encapsuler ces PWA dans une application Android. L'équipe PWABuilder a rédigé un excellent article de blog sur la génération d'une application Android à l'aide de cet outil.
Vérifier 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 à partir de 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 se chargent de 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 diffusé auprès des utilisateurs finaux est de la télécharger depuis le Play Store.
Pour éviter de présenter 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. Rendez le fichier assetlinks.json généré disponible à l'adresse /.well-known/assetlinks.json, dans le domaine en cours de validation.
Étapes suivantes
Une progressive web app est 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, lisez nos conseils pour créer une PWA de qualité. Si vous disposez 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 l'application 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.