Page hors connexion de base pour les applications Web sur Chrome pour Android

Les applications de la plate-forme installées peuvent être lancées même hors connexion. Dans ce cas, ils incluent souvent une page informant l'utilisateur que l'accès à Internet n'est pas disponible. Certains développeurs créent même un ensemble complet de fonctionnalités utilisables hors connexion.

Avec les applications Web, la possibilité de travailler hors connexion est plus récente. Elle est devenue possible avec le lancement de l'API Service Worker. De plus, lorsque les sites Web étaient devenus installables, les PWA ont ajouté une exigence pour enregistrer un service worker et implémenter sa méthode fetch() pour qu'une application Web puisse être installée. L'idée était d'inciter les développeurs à informer au moins leurs utilisateurs que l'application ne peut pas être utilisée pour le moment.

Les développeurs n'ont désormais rien à faire pour obtenir une page hors connexion par défaut. À partir de Chrome 109 sur Android, le navigateur génère automatiquement une page qui informe l'utilisateur lorsqu'il est hors connexion.

Si l'application ne propose pas d'expérience hors connexion personnalisée, lorsque l'utilisateur est hors connexion, la page par défaut hors connexion utilise l'icône de l'application et le message Vous êtes hors connexion. comme dans l'exemple ci-dessous.

Page hors connexion par défaut d'un exemple d'application Web, sur laquelle le logo est composé d'un cercle rose et de deux signes plus, et qui inclut le message "vous êtes déconnecté".

Accédez à ce bug pour voir l'exemple précédent en action.

L'option permettant de créer votre propre page hors connexion personnalisée reste disponible. La vidéo suivante montre comment diffuser votre page personnalisée à l'aide de Workbox, avec une seule ligne de code.

Cette fonctionnalité est disponible sur Android (Chrome 109) et sur les ordinateurs (Chrome 110). Si vous avez des commentaires, envoyez-nous via ce formulaire.

Photo de Sten Ritterfeld sur Unsplash