Hai quindi un'app web progressiva, completa di un service worker che le consente di funzionare offline. Bene. Hai già configurato Google Analytics per la tua app web e non vuoi perderti gli approfondimenti analitici derivanti dall'utilizzo offline. Tuttavia, se provi a inviare dati a Google Analytics in modalità offline, queste richieste non andranno a buon fine e i dati andranno persi.
La soluzione, non ti sorprenderà sapere, è costituita dai worker di servizio. Nello specifico, aggiunge codice al tuo service worker per memorizzare le richieste di Google Analytics (utilizzando IndexedDB) e riprovare in un secondo momento, quando si spera che sia disponibile una rete. Abbiamo condiviso il codice per gestire questa logica nell'app web Google I/O open source, ma ci siamo resi conto che si trattava di un pattern utile e che la copia e incolla del codice può essere fragile.
Oggi siamo lieti di annunciare che tutto ciò che ti serve per gestire le richieste di Google Analytics offline all'interno del tuo service worker è stato raggruppato in un pacchetto npm: npm install --save-dev sw-offline-google-analytics
Utilizzo di sw-offline-google-analytics
All'interno del codice del tuo service worker esistente, aggiungi quanto segue:
// 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.
E con questo è tutto!
Che cosa succede sotto il cofano?
sw-offline-google-analytics configura un nuovo gestore eventi fetch nel tuo service worker, che risponde alle richieste effettuate al dominio Google Analytics. La libreria ignora le richieste non di Google Analytics, dando agli altri gestori di eventi fetch del tuo service worker la possibilità di implementare strategie appropriate per queste risorse. Innanzitutto tenterà di soddisfare la richiesta sulla rete. Se l'utente è online, la procedura continuerà normalmente.
Se la richiesta di rete non va a buon fine, la libreria memorizza automaticamente le informazioni sulla richiesta in IndexedDB, insieme a un timestamp che indica quando è stata effettuata inizialmente la richiesta. Ogni volta che il tuo service worker si avvia, la libreria controlla se sono presenti richieste in coda e tenta di inviarle di nuovo, insieme ad alcuni parametri aggiuntivi di Google Analytics:
- Un parametro
qtimpostato sul tempo trascorso dal primo tentativo di richiesta per garantire che l'ora originale venga attribuita correttamente. - Eventuali parametri aggiuntivi e valori forniti nella proprietà
parameterOverridesdell'oggetto di configurazione passati agoog.offlineGoogleAnalytics.initialize(). Ad esempio, puoi includere una dimensione personalizzata per distinguere le richieste inviate di nuovo dal service worker da quelle inviate immediatamente.
Se la richiesta di invio viene eseguita correttamente, ottimo. La richiesta viene rimossa da IndexedDB. Se il nuovo tentativo non va a buon fine e la richiesta iniziale è stata effettuata meno di 24 ore fa, verrà conservata in IndexedDB per essere riprovata al successivo avvio del servizio worker. Tieni presente che non è garantito che gli hit di Google Analytics precedenti a quattro ore vengano elaborati, ma non è un problema inviare di nuovo gli hit un po' più vecchi"per sicurezza".
sw-offline-google-analytics implements anche una strategia"prima la rete, poi la cache" per il analytics.js codice JavaScript effettivo necessario per avviare Google Analytics.
Non è finita qui.
sw-offline-google-analytics fa parte del più grande progetto sw-helpers, ovvero una raccolta di librerie pensata per fornire miglioramenti immediati alle implementazioni esistenti dei worker di servizio.
Fa parte del progetto anche sw-appcache-behavior, una libreria che implementa le strategie di memorizzazione nella cache definite in un manifest AppCache esistente all'interno di un worker di servizio. Il suo scopo è aiutarti a eseguire la migrazione da AppCache a service worker mantenendo una strategia di memorizzazione nella cache coerente, almeno inizialmente.
Se hai altre idee per la raccolta, non esitare a contattarci. Invia una richiesta nell'Issue Tracker.