çalışma kutusu-google-analytics

Çevrimdışı çalışan bir uygulama oluşturuyorsanız bağlantıları olmadığında kullanıcıların uygulamanızla nasıl etkileşimde bulunduğunu anlamak, bu deneyimi optimize etmek için çok önemlidir.

Google Analytics gibi analiz sağlayıcıları, sunucularına veri göndermek için bir ağ bağlantısına ihtiyaç duyar. Bu, bağlantı olmadığında isteklerin başarısız olacağı ve bu etkileşimlerin analiz raporlarınızda yer almayacağı anlamına gelir. Sanki bunlar hiç yaşanmamıştı.

Workbox Google Analytics, Service Worker'ın başarısız istekleri tespit edebilmesini kullanarak bu sorunu Google Analytics kullanıcıları için çözer.

Google Analytics, tüm verileri HTTP istekleri aracılığıyla Measurement Protocol'a alır. Diğer bir deyişle, bir Service Worker komut dosyası, Measurement Protocol'a gönderilen başarısız istekleri algılamak için bir getirme işleyici ekleyebilir. Bu istekleri IndexedDB'de depolayabilir ve bağlantı yeniden kurulduğunda bunları daha sonra yeniden deneyebilir.

Workbox Google Analytics tam olarak bunu yapar. Ayrıca, analytics.js ve gtag.js komut dosyalarını önbelleğe almak için getirme işleyicileri ekler, böylece çevrimdışı da çalışabilirler. Son olarak, başarısız istekler yeniden denendiğinde Workbox Google Analytics, Google Analytics'teki zaman damgalarının ilk kullanıcı etkileşiminin zamanını yansıtmasını sağlamak için istek yükündeki qt değerini otomatik olarak ayarlar (veya günceller).

Çalışma Kutusu Google Analytics'i Etkinleştirme

Workbox Google Analytics'i etkinleştirmek için initialize() yöntemini çağırın:

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

googleAnalytics.initialize();

Bu, Google Analytics'e gelen başarısız istekleri sıraya almak ve yeniden denemek için gereken tek koddur ve Google Analytics'in çevrimdışı çalışmasını sağlamanın en basit yoludur.

Ancak yalnızca yukarıdaki kod kullanılırsa yeniden denenen istekler ilk denemede başarılı olan isteklerden ayırt edilemez. Bu, çevrimdışı kullanıcılardan tüm etkileşim verilerini alacağınız ancak kullanıcı çevrimdışıyken hangi etkileşimlerin gerçekleştiğini öğrenemeyeceğiniz anlamına gelir.

Bu endişeyi gidermek amacıyla, yeniden denenen istekte gönderilen verileri değiştirmek veya verilere açıklama eklemek için aşağıda açıklanan yapılandırma seçeneklerinden birini kullanabilirsiniz.

Gönderilecek verileri değiştirme

Yeniden denenen istekleri yeniden denenmeyen isteklerden ayırt edebilmek istiyorsanız parameterOverrides veya hitFilter yapılandırma seçeneklerini belirtebilirsiniz.

Bu seçenekler, yeniden deneme isteğinde gönderilen Measurement Protocol parametrelerini değiştirmenize olanak tanır. Yeniden denenen her istek için belirli bir parametrede aynı değeri ayarlamak istediğinizde parameterOverrides seçeneği kullanılmalıdır. Belirli bir parametre değerinin çalışma zamanında hesaplanması veya başka bir parametrenin değerinden türetilmesi gereken durumlarda hitFilter seçeneği kullanılmalıdır.

Aşağıdaki örneklerde, her iki seçeneği nasıl kullanacağınız gösterilmektedir.

Örnekler

Çevrimiçi ve çevrimdışı etkileşimleri izlemek için bir özel boyut kullanma

Google Analytics'te çevrimiçi ve çevrimdışı etkileşimler için yerleşik bir boyut yoktur. Ancak, özel boyutlar adı verilen bir özelliği kullanarak tam olarak bu amaçla kendi boyutunuzu oluşturabilirsiniz.

Workbox Google Analytics ile özel bir boyut kullanarak Service Worker tarafından tekrarlanan istekleri izlemek için aşağıdaki adımları uygulayın:

1. Google Analytics'te yeni bir özel boyut oluşturun. Listeye "Ağ Durumu" gibi bir ad verin ve kapsamını "isabet" olarak ayarlayın (tüm etkileşimler çevrimdışı olabileceği için).

2. Yeni oluşturulan boyut için atanan dizini not edin ve bunu, Workbox Google Analytics kodunuzdaki parameterOverrides yapılandırma seçeneğine parametre adı olarak iletin.

   Örneğin, bu ilk özel boyutunuzsa dizini 1 ve parametre adı cd1 olur (dizin 8 olsaydı cd8 olurdu):

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

3. (İsteğe bağlı) parameterOverrides değeri yalnızca yeniden denenen ("çevrimdışı") isteklere uygulandığından, tüm diğer istekler için varsayılan bir "çevrimiçi" değeri belirlemek de isteyebilirsiniz. Bu şart şart olmamakla birlikte, raporlarınızın okunmasını kolaylaştırır.
   
   Örneğin, Google Analytics'i yüklemek için varsayılan analytics.js izleme snippet'ini kullandıysanız ga('set', 'dimension1', 'online') satırını ekleyerek "Ağ Durumu" özel boyutunuz için hizmet çalışanı tarafından tekrar oynatılmayan tüm isteklerde varsayılan 'online' değerini kullanabilirsiniz.

   <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>
   

Sırada harcanan istekleri izlemek için özel metrik kullanma

Çevrimdışı etkileşimin gerçekleşmesi ile bağlantının yeniden kurulup isteğin başarıyla yeniden denenmesi arasında ne kadar süre geçtiğini merak ediyorsanız özel metrik ve hitFilter yapılandırma seçeneğini kullanarak bunu izleyebilirsiniz:

1. Google Analytics'te yeni bir özel metrik oluşturun. Listeye "Çevrimdışı Sıra Süresi" gibi bir ad verin, kapsamını "isabet" olarak ayarlayın ve biçimlendirme türünü "Zaman" (saniye cinsinden) olarak ayarlayın.

2. qt parametresinin değerini almak ve 1000'e bölmek (saniyeye dönüştürmek için) hitFilter seçeneğini kullanın. Ardından bu değeri, yeni oluşturulan metriğin diziniyle birlikte bir parametre olarak ayarlayın. Bu ilk özel metriğinizse parametre adı 'cm1' olur:

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

Çalışma Kutusu Google Analytics'i Test Etme

Workbox Google Analytics, etkinlikleri tekrarlamak için Arka Plan Senkronizasyonu kullandığından bunu test etmek zor olabilir. Çalışma Kutusu Arka Plan Senkronizasyonunu Test Etme sayfasından daha fazla bilgi edinebilirsiniz.

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