Vous disposez donc d'une application Web progressive, avec un service worker qui lui permet de fonctionner hors connexion. Parfait ! Vous avez également configuré Google Analytics pour votre application Web et vous ne voulez pas manquer les insights analytiques issus de l'utilisation hors connexion. Toutefois, si vous essayez d'envoyer des données à Google Analytics lorsque vous êtes hors connexion, ces requêtes échoueront et les données seront perdues.
La solution, vous ne serez pas surpris de l'apprendre, est les service workers. Plus précisément, il ajoute du code à votre service worker pour stocker les requêtes Google Analytics (à l'aide de IndexedDB) et les réessayer plus tard, si un réseau est disponible. Nous avons partagé du code pour gérer cette logique dans l'application Web Google I/O open source, mais nous avons réalisé qu'il s'agissait d'un modèle utile, et que copier-coller du code pouvait être fragile.
Nous sommes heureux de vous annoncer aujourd'hui que tout ce dont vous avez besoin pour gérer les requêtes Google Analytics hors connexion dans votre service worker a été regroupé dans un package npm: npm install --save-dev sw-offline-google-analytics
Utiliser sw-offline-google-analytics
Dans votre code de service worker existant, ajoutez ce qui suit:
// This code should live inside your service worker JavaScript, ideally
// before any other 'fetch' event handlers are defined:
// First, import the library into the service worker global scope:
importScripts('path/to/offline-google-analytics-import.js');
// Then, call goog.offlineGoogleAnalytics.initialize():
// See https://github.com/GoogleChrome/workbox/tree/main/packages/workbox-google-analytics
goog.offlineGoogleAnalytics.initialize();
// At this point, implement any other service worker caching strategies
// appropriate for your web app.
Le plus important !
Que se passe-t-il sous le capot ?
sw-offline-google-analytics configure un nouveau gestionnaire d'événements fetch dans votre service worker, qui répond aux requêtes envoyées au domaine Google Analytics. (La bibliothèque ignore les requêtes autres que Google Analytics, ce qui permet aux autres gestionnaires d'événements fetch de votre service worker d'implémenter des stratégies appropriées pour ces ressources.) Il tente d'abord de répondre à la requête sur le réseau. Si l'utilisateur est en ligne, la procédure se déroule normalement.
Si la requête réseau échoue, la bibliothèque stocke automatiquement les informations sur la requête dans IndexedDB, ainsi qu'un code temporel indiquant quand la requête a été effectuée pour la première fois. Chaque fois que votre service worker démarre, la bibliothèque recherche les requêtes en file d'attente et tente de les renvoyer, ainsi que certains paramètres Google Analytics supplémentaires:
- Un paramètre
qt, défini sur le temps écoulé depuis la première tentative de la requête, pour s'assurer que l'heure d'origine est correctement attribuée. - Tous les paramètres supplémentaires et valeurs fournis dans la propriété
parameterOverridesde l'objet de configuration transmis àgoog.offlineGoogleAnalytics.initialize(). Par exemple, vous pouvez inclure une dimension personnalisée pour distinguer les requêtes renvoyées par le service worker de celles qui ont été envoyées immédiatement.
Si la requête est renvoyée, c'est parfait. La requête est supprimée d'IndexedDB. Si la nouvelle tentative échoue et que la requête initiale a été effectuée il y a moins de 24 heures, elle sera conservée dans IndexedDB pour être réessayée la prochaine fois que le service worker démarrera. Notez que le traitement des appels Google Analytics datant de plus de quatre heures n'est pas garanti, mais renvoyer des appels un peu plus anciens"au cas où" ne devrait pas poser de problème.
sw-offline-google-analytics implements également une stratégie "d'abord le réseau, puis le cache" pour le code JavaScript analytics.js réel nécessaire à l'amorçage de Google Analytics.
D'autres nouveautés sont à venir !
sw-offline-google-analytics fait partie du plus grand projet sw-helpers, qui est une collection de bibliothèques destinée à fournir des améliorations prêtes à l'emploi aux implémentations de service worker existantes.
sw-appcache-behavior, une bibliothèque qui implémente des stratégies de mise en cache définies dans un fichier manifeste AppCache existant dans un service worker, fait également partie de ce projet. Il est conçu pour vous aider à passer d'AppCache aux services workers tout en conservant une stratégie de mise en cache cohérente, du moins au début.
Si vous avez d'autres idées de bibliothèques, n'hésitez pas à nous en faire part. Veuillez donc envoyer une demande dans l'outil de suivi des problèmes.