Jadi, Anda memiliki aplikasi web progresif, lengkap dengan pekerja layanan yang memungkinkannya berfungsi secara offline. Bagus! Anda juga telah menyiapkan Google Analytics untuk aplikasi web, dan tidak ingin melewatkan insight analisis apa pun yang berasal dari penggunaan yang terjadi saat offline. Namun, jika Anda mencoba mengirim data ke Google Analytics saat offline, permintaan tersebut akan gagal dan data akan hilang.
Solusi yang akan Anda pelajari ini tidak akan mengejutkan Anda, yaitu service worker. Secara khusus, kode ini menambahkan kode ke pekerja layanan Anda untuk menyimpan permintaan Google Analytics (menggunakan IndexedDB) dan mencobanya lagi nanti jika jaringan tersedia. Kami membagikan kode untuk menangani logika ini sebagai bagian dari aplikasi web Google I/O open source, tetapi menyadari bahwa ini adalah pola yang berguna, dan menyalin serta menempelkan kode dapat menjadi masalah.
Hari ini, dengan senang hati kami mengumumkan bahwa semua yang Anda perlukan untuk menangani permintaan Google Analytics offline dalam pekerja layanan telah dipaketkan ke dalam paket npm: npm install --save-dev sw-offline-google-analytics
Menggunakan sw-offline-google-analytics
Dari dalam kode pekerja layanan yang ada, tambahkan kode berikut:
// 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.
Selesai.
Apa yang terjadi di balik layar?
sw-offline-google-analytics menyiapkan pengendali peristiwa fetch baru di pekerja layanan Anda, yang merespons permintaan yang dibuat ke domain Google Analytics. (Library ini mengabaikan permintaan non-Google Analytics, sehingga pengendali peristiwa fetch lain dari pekerja layanan Anda memiliki kesempatan untuk menerapkan strategi yang sesuai untuk resource tersebut.) Pertama-tama, permintaan akan mencoba memenuhi permintaan terhadap jaringan. Jika pengguna sedang online, proses akan dilanjutkan seperti biasa.
Jika permintaan jaringan gagal, library akan otomatis menyimpan informasi tentang permintaan ke IndexedDB, beserta stempel waktu yang menunjukkan kapan permintaan awalnya dibuat. Setiap kali pekerja layanan dinyalakan, library akan memeriksa permintaan yang diantrekan dan mencoba mengirim ulang permintaan tersebut, beserta beberapa parameter Google Analytics tambahan:
- Parameter
qt, yang ditetapkan ke jumlah waktu yang telah berlalu sejak permintaan pertama kali dicoba, untuk memastikan bahwa waktu asli diatribusikan dengan benar. - Setiap parameter tambahan dan nilai yang disediakan di properti
parameterOverridesobjek konfigurasi yang diteruskan kegoog.offlineGoogleAnalytics.initialize(). Misalnya, Anda dapat menyertakan dimensi kustom untuk membedakan permintaan yang dikirim ulang dari pekerja layanan dengan permintaan yang langsung dikirim.
Jika pengiriman ulang permintaan berhasil, bagus! Permintaan tersebut akan dihapus dari IndexedDB. Jika percobaan ulang gagal, dan permintaan awal dibuat kurang dari 24 jam yang lalu, permintaan tersebut akan disimpan di IndexedDB untuk dicoba lagi saat pekerja layanan dimulai lagi. Perlu diperhatikan bahwa hit Google Analytics yang lebih lama dari empat jam tidak dijamin akan diproses, tetapi mengirim ulang hit yang agak lama "untuk berjaga-jaga" tidak akan merugikan.
sw-offline-google-analytics juga implements strategi"jaringan terlebih dahulu, kembali ke cache" untuk kode JavaScript analytics.js yang sebenarnya diperlukan untuk mem-bootstrap Google Analytics.
Masih ada lagi!
sw-offline-google-analytics adalah bagian dari project sw-helpers yang lebih besar, yang merupakan kumpulan library yang dimaksudkan untuk memberikan peningkatan langsung ke implementasi pekerja layanan yang ada.
Bagian dari project tersebut juga adalah sw-appcache-behavior, library yang menerapkan strategi penyimpanan dalam cache yang ditentukan dalam manifes AppCache yang ada di dalam pekerja layanan. Library ini dimaksudkan untuk membantu Anda bermigrasi dari AppCache ke service worker sekaligus mempertahankan strategi penyimpanan dalam cache yang konsisten, setidaknya pada awalnya.
Jika Anda memiliki ide koleksi lain, beri tahu kami. Jadi, ajukan permintaan di issue tracker.