Artık progresif web uygulamanız var ve çevrimdışı çalışmasını sağlayan bir Service Worker var. İsteğinizi aldık. Ayrıca, web uygulamanız için Google Analytics ayarlanmış durumda ve internete bağlı değilken yapılan kullanımdan elde edilen analiz bilgilerini kaçırmak istemiyorsunuz. Ancak çevrimdışıyken Google Analytics'e veri göndermeye çalışırsanız bu istekler başarısız olur ve veriler kaybolur.
Öğrenmeye şaşırmamak gerekir ki çözümün adı da hizmet çalışanları. Daha ayrıntılı ifade etmek gerekirse, Google Analytics isteklerini IndexedDB kullanarak depolamak (IndexedDB kullanarak) ve kullanılabilir bir ağ olduğunda daha sonra tekrar denemek için hizmet çalışanınıza kod eklemek anlamına gelir. Bu mantığı açık kaynaklı Google I/O web uygulamasının bir parçası olarak işlemek için kodu paylaştık. Ancak bunun kullanışlı bir yöntem olduğunu, kodun kopyalanıp yapıştırılmasının hassas olabileceğini fark ettik.
Bugün, hizmet çalışanınızda çevrimdışı Google Analytics isteklerini ele almak için ihtiyacınız olan her şeyin bir npm paketinde toplandığını duyurmaktan mutluluk duyuyoruz: npm install --save-dev sw-offline-google-analytics
sw-offline-google-analytics'i kullanma
Mevcut Service Worker kodunuza aşağıdakileri ekleyin:
// 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.
Hepsi bu kadar!
Arka planda neler oluyor?
sw-offline-google-analytics, hizmet çalışanınızda yeni bir fetch etkinlik işleyici oluşturur. Bu etkinlik işleyici, Google Analytics alanına gönderilen isteklere yanıt verir. (Kitaplık, Google Analytics dışı istekleri yok sayar ve böylece hizmet çalışanınızın diğer fetch etkinlik işleyicilerine bu kaynaklar için uygun stratejileri uygulama şansı verir.) Önce, ağda isteği yerine getirmeyi dener. Kullanıcı çevrimiçiyse bu işlem normal şekilde devam eder.
Ağ isteği başarısız olursa kitaplık, IndexedDB isteğiyle ilgili bilgileri ve isteğin ilk ne zaman yapıldığını belirten bir zaman damgası ile birlikte otomatik olarak saklar. Hizmet çalışanınız başlatıldığında, kitaplık bazı ek Google Analytics parametreleriyle birlikte sıradaki istekleri kontrol eder ve bunları yeniden göndermeye çalışır:
- Orijinal saatin düzgün şekilde ilişkilendirilmesini sağlamak için, isteğin ilk denenmesinden bu yana geçen süreye ayarlanmış
qtparametresi. goog.offlineGoogleAnalytics.initialize()'e iletilen yapılandırma nesnesininparameterOverridesözelliğinde sağlanan tüm ek parametreler ve değerler. Örneğin, Service Worker'dan yeniden gönderilen istekleri hemen gönderilenlerden ayırt etmek için bir özel boyut ekleyebilirsiniz.
İsteğin yeniden gönderilmesi başarılı olursa harika! İstek IndexedDB'den kaldırıldı. Yeniden deneme başarısız olursa ve ilk istek 24 saatten kısa bir süre önce yapıldıysa hizmet çalışanının bir sonraki başlatılışında yeniden denenmek üzere istek IndexedDB içinde saklanır. Dört saatten eski olan Google Analytics isabetlerinin işlenmesinin garanti edilmediğini, ancak biraz daha eski isabetlerin "her ihtimale karşı" yeniden gönderilmesinin zarar vermeyeceğini unutmayın.
sw-offline-google-analytics ayrıca, Google Analytics'i önyüklemek için gereken gerçek analytics.js JavaScript kodu için "önce ağ, önbelleğe alma" stratejisi de implements.
Daha birçok yenilik var.
sw-offline-google-analytics, daha geniş kapsamlı olan sw-helpers projesinin bir parçasıdır. Kitaplık koleksiyonu, mevcut Service Worker uygulamalarında geçici iyileştirmeler sağlamak için tasarlanmıştır.
Ayrıca bu projenin bir parçası sw-appcache-behavior, hizmet çalışanı içindeki mevcut bir AppCache manifest'inde tanımlanmış önbelleğe alma stratejilerini uygulayan bir kitaplıktır. Tutarlı bir önbelleğe alma stratejisi kullanırken en azından başlangıçta AppCache'den hizmet çalışanlarına geçiş yapmanıza yardımcı olmak için tasarlanmıştır.
Kitaplıkla ilgili başka fikirleriniz varsa öğrenmekten memnuniyet duyarız. Bu nedenle, lütfen sorun izleyici aracılığıyla bir istek gönderin.