Workbox-google-analytics

Jeśli tworzysz aplikację, która działa w trybie offline, musisz wiedzieć, jak użytkownicy wchodzą z nią w interakcję, gdy nie mają połączenia z internetem. Jest to niezwykle ważne, aby zoptymalizować tę aplikację.

Dostawcy usług analitycznych, tacy jak Google Analytics, wymagają połączenia sieciowego do wysyłania danych na swoje serwery. Oznacza to, że jeśli połączenie jest niedostępne, żądania zakończą się niepowodzeniem, a tych interakcji nie będzie w raportach analitycznych. Pomyśl, że nigdy nie zdarzyły się te sytuacje.

Workbox Google Analytics rozwiązuje ten problem dla użytkowników Google Analytics, wykorzystując zdolność procesu Service Worker do wykrywania nieudanych żądań.

Google Analytics otrzymuje wszystkie dane w żądaniach HTTP wysyłanych do platformy Measurement Protocol, co oznacza, że skrypt skryptu service worker może dodać moduł obsługi pobierania, aby wykrywać nieudane żądania wysyłane do platformy Measurement Protocol. Może zapisać te żądania w IndexedDB, a następnie spróbować je później, gdy połączenie zostanie przywrócone.

Workbox Google Analytics odpowiada właśnie temu. Dodaje też moduły obsługi pobierania do pamięci podręcznej skryptów analytics.js i gtag.js, dzięki czemu można je też uruchamiać offline. Po ponawianiu nieudanych żądań usługa Workbox Google Analytics automatycznie ustawia (lub aktualizuje) element qt w ładunku żądania, aby sygnatury czasowe w Google Analytics odzwierciedlały czas pierwotnej interakcji użytkownika.

Włączanie Google Analytics w Workbox

Aby włączyć Google Analytics w Workbox, wywołaj metodę initialize():

import * as googleAnalytics from 'workbox-google-analytics';

googleAnalytics.initialize();

To jedyny kod wymagany do umieszczania w kolejce i ponawiania nieudanych żądań do Google Analytics. Jest to najprostszy sposób na uruchomienie Google Analytics w trybie offline.

Jeśli jednak używasz tylko powyższego kodu, ponawianych żądań nie da się odróżnić od żądań, które zakończyły się sukcesem za pierwszym razem. Oznacza to, że będziesz otrzymywać wszystkie dane o interakcjach użytkowników offline, ale nie będziesz mieć informacji o tym, jakie interakcje miały miejsce w czasie, gdy dany użytkownik był offline.

Aby rozwiązać ten problem, możesz użyć jednej z opisanych poniżej opcji konfiguracji, aby zmodyfikować lub dodać adnotacje do danych wysyłanych w ponownym żądaniu.

Modyfikowanie rodzaju wysyłanych danych

Aby móc odróżniać żądania ponowione od tych, które nie zostały ponownie wykonane, możesz określić opcje konfiguracji parameterOverrides lub hitFilter.

Te opcje umożliwiają modyfikowanie parametrów platformy Measurement Protocol, które są wysyłane w ponownym żądaniu. Opcji parameterOverrides należy używać, gdy chcesz ustawić tę samą wartość dla konkretnego parametru dla każdego ponownego żądania. Opcji hitFilter należy używać wtedy, gdy wartość konkretnego parametru musi zostać obliczona w czasie działania lub pobrana z wartości innego parametru.

Poniższe przykłady pokazują, jak korzystać z obu tych opcji.

Przykłady

Używanie wymiaru niestandardowego do śledzenia interakcji online i offline

Google Analytics nie ma wbudowanego wymiaru umożliwiającego porównywanie interakcji online i offline. Możesz jednak utworzyć własny wymiar dokładnie do tego celu, korzystając z funkcji o nazwie wymiary niestandardowe.

Aby śledzić żądania odtwarzane ponownie przez skrypt service worker za pomocą wymiaru niestandardowego za pomocą Workbox Google Analytics, wykonaj te czynności:

1. Utwórz nowy niestandardowy wymiar w Google Analytics. Nadaj mu nazwę np. „Stan sieci” i ustaw jego zakres na „działanie” (ponieważ każda interakcja może mieć charakter offline).

2. Zanotuj indeks przypisany do nowo utworzonego wymiaru i przekaż go jako nazwę parametru do opcji konfiguracji parameterOverrides w kodzie Workbox Google Analytics.

   Jeśli np. to Twój pierwszy niestandardowy wymiar, jego indeks będzie miał postać 1, a nazwa parametru będzie miała postać cd1 (jeśli indeks ma wartość 8, będzie to cd8):

   import * as googleAnalytics from 'workbox-google-analytics';
   
   googleAnalytics.initialize({
     parameterOverrides: {
       cd1: 'offline',
     },
   });
   

3. (Opcjonalnie) Wartości w polu parameterOverrides są stosowane tylko do ponawianych żądań („offline”), dlatego możesz też ustawić domyślną wartość „online” dla wszystkich innych żądań. Chociaż nie jest to konieczne, zwiększy to czytelność raportów.
   
   Jeśli np. do instalacji Google Analytics został użyty domyślny fragment kodu śledzenia analytics.js, możesz dodać wiersz ga('set', 'dimension1', 'online'), aby używać domyślnej wartości 'online' dla wymiaru niestandardowego „Stan sieci” w przypadku wszystkich żądań, które nie były odtwarzane przez skrypt service worker.

   <script>
     (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
     (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
     m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
     })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
   
     ga('create', 'UA-XXXXX-Y', 'auto');
   
     // Set default value of custom dimension 1 to 'online'
     ga('set', 'dimension1', 'online');
   
     ga('send', 'pageview');
   </script>
   

Używanie danych niestandardowych do śledzenia czasu trwania żądań w kolejce

Jeśli chcesz się dowiedzieć, ile czasu upłynęło między interakcją offline a przywróceniem połączenia a ponownym próbą wysłania żądania, możesz to śledzić za pomocą danych niestandardowych i opcji konfiguracji hitFilter:

1. Utwórz nowe dane niestandardowe w Google Analytics. Nadaj mu nazwę np. „Czas kolejki offline”, ustaw jego zakres na „działanie” i ustaw typ formatowania na „Czas” (w sekundach).

2. Użyj opcji hitFilter, aby uzyskać wartość parametru qt i podzielić ją przez 1000 (aby przekonwertować ją na sekundy). Następnie ustaw tę wartość jako parametr z indeksem nowo utworzonego wskaźnika. Jeśli to Twoje pierwsze dane niestandardowe, nazwa parametru będzie wyglądać tak: 'cm1':

   import * as googleAnalytics from 'workbox-google-analytics';
   
   googleAnalytics.initialize({
     hitFilter: (params) => {
       const queueTimeInSeconds = Math.round(params.get('qt') / 1000);
       params.set('cm1', queueTimeInSeconds);
     },
   });
   

Testowanie Workbox w Google Analytics

Ponieważ Workbox Google Analytics ponownie odtwarza zdarzenia za pomocą synchronizacji w tle, testowanie może być nieintuicyjne. Więcej informacji znajdziesz w artykule o testowaniu synchronizacji w tle.

workbox-google-analytics.initialize(
  options?: GoogleAnalyticsInitializeOptions,
)