ตอนนี้คุณมี Progressive Web App พร้อม Service Worker ที่ทําให้แอปทํางานแบบออฟไลน์ได้ เยี่ยม! นอกจากนี้ คุณยังตั้งค่า Google Analytics ไว้สําหรับเว็บแอปอยู่แล้ว และไม่อยากพลาดข้อมูลเชิงลึกการวิเคราะห์ที่มาจากการใช้งานที่เกิดขึ้นขณะออฟไลน์ แต่หากคุณพยายามส่งข้อมูลไปยัง Google Analytics ขณะออฟไลน์ คําขอเหล่านั้นจะดำเนินการไม่สําเร็จและข้อมูลจะสูญหาย
คําตอบที่ไม่น่าแปลกใจเลยก็คือ Service Worker กล่าวโดยละเอียดคือ การเพิ่มโค้ดลงใน Service Worker เพื่อจัดเก็บคําขอ Google Analytics (โดยใช้ IndexedDB) และลองอีกครั้งในภายหลังเมื่อเครือข่ายพร้อมใช้งาน เราได้แชร์โค้ดเพื่อจัดการตรรกะนี้เป็นส่วนหนึ่งของเว็บแอป Google I/O โอเพนซอร์ส แต่พบว่านี่เป็นรูปแบบที่มีประโยชน์ และการคัดลอกและวางโค้ดอาจทำให้เกิดข้อผิดพลาดได้
วันนี้ เรายินดีที่จะประกาศว่าทุกอย่างที่จําเป็นในการจัดการคําขอ Google Analytics ออฟไลน์ภายใน Service Worker ได้รับการรวมไว้ในแพ็กเกจ npm npm install --save-dev sw-offline-google-analytics แล้ว
การใช้ sw-offline-google-analytics
จากภายในโค้ด Service Worker ที่มีอยู่ ให้เพิ่มข้อมูลต่อไปนี้
// 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.
เท่านี้ก็เรียบร้อย
สิ่งที่เกิดขึ้นเบื้องหลัง
sw-offline-google-analytics จะตั้งค่าตัวแฮนเดิลเหตุการณ์ fetch ใหม่ใน Service Worker ซึ่งจะตอบสนองคําขอที่ส่งไปยังโดเมน Google Analytics (ไลบรารีจะไม่สนใจคําขอที่ไม่ใช่ของ Google Analytics ซึ่งช่วยให้ตัวแฮนเดิลเหตุการณ์ fetch อื่นๆ ของ Service Worker มีเวลาใช้กลยุทธ์ที่เหมาะสมกับทรัพยากรเหล่านั้น) โดยระบบจะพยายามดำเนินการตามคำขอกับเครือข่ายก่อน หากผู้ใช้ออนไลน์อยู่ การดำเนินการจะดำเนินต่อไปตามปกติ
หากคำขอเครือข่ายไม่สำเร็จ ไลบรารีจะจัดเก็บข้อมูลเกี่ยวกับคำขอไปยัง IndexedDB โดยอัตโนมัติ พร้อมกับการประทับเวลาที่ระบุเวลาที่ส่งคำขอครั้งแรก ทุกครั้งที่ Service Worker เริ่มต้นทำงาน ไลบรารีจะตรวจสอบคําขอที่อยู่ในคิวและพยายามส่งคําขอเหล่านั้นอีกครั้ง พร้อมกับพารามิเตอร์ Google Analytics เพิ่มเติมบางส่วน ดังนี้
- พารามิเตอร์
qtซึ่งตั้งค่าเป็นระยะเวลาที่ผ่านไปนับตั้งแต่มีการพยายามส่งคำขอครั้งแรก เพื่อให้แน่ใจว่ามีการระบุแหล่งที่มาของเวลาเดิมอย่างถูกต้อง - พารามิเตอร์เพิ่มเติมและค่าที่ระบุในพร็อพเพอร์ตี้
parameterOverridesของออบเจ็กต์การกําหนดค่าที่ส่งไปยังgoog.offlineGoogleAnalytics.initialize()เช่น คุณอาจใส่มิติข้อมูลที่กำหนดเองเพื่อแยกคำขอที่ส่งอีกครั้งจาก Service Worker ออกจากคำขอที่ส่งทันที
หากการส่งคำขออีกครั้งสำเร็จ ก็เยี่ยมไปเลย ระบบจะนำคำขอออกจาก IndexedDB หากการลองอีกครั้งไม่สำเร็จ และคำขอเริ่มต้นเกิดขึ้นไม่ถึง 24 ชั่วโมงที่ผ่านมา ระบบจะเก็บคำขอไว้ใน IndexedDB เพื่อลองอีกครั้งเมื่อ Service Worker เริ่มทำงานครั้งถัดไป โปรดทราบว่าระบบไม่รับประกันว่าระบบจะประมวลผล Hit ของ Google Analytics ที่เก่ากว่า4 ชั่วโมง แต่การส่ง Hit ที่เก่ากว่าไปอีกครั้ง "เผื่อไว้" ก็ไม่ใช่เรื่องเสียหาย
sw-offline-google-analytics ยังimplementsกลยุทธ์ "ใช้เครือข่ายก่อน แล้วเปลี่ยนไปใช้แคชหากจำเป็น" สำหรับanalytics.jsโค้ด JavaScript จริงที่จําเป็นสําหรับการเริ่มต้นใช้งาน Google Analytics
โปรดติดตามข้อมูลเพิ่มเติมในเร็วๆ นี้
sw-offline-google-analytics เป็นส่วนหนึ่งของโปรเจ็กต์ sw-helpers ขนาดใหญ่ ซึ่งเป็นคอลเล็กชันไลบรารีที่มีไว้เพื่อมอบการปรับปรุงแบบติดตั้งใช้งานทันทีให้กับการใช้งาน Service Worker ที่มีอยู่
sw-appcache-behavior ซึ่งเป็นไลบรารีที่ใช้กลยุทธ์การแคชที่กําหนดไว้ใน AppCache Manifest ที่มีอยู่ภายใน Service Worker ก็เป็นส่วนหนึ่งของโปรเจ็กต์นี้ด้วย โดยมีวัตถุประสงค์เพื่อช่วยคุณย้ายข้อมูลจาก AppCache ไปยัง Service Worker ขณะรักษากลยุทธ์การแคชที่สอดคล้องกันไว้อย่างน้อยในช่วงแรก
หากมีแนวคิดอื่นๆ เกี่ยวกับคลัง โปรดแจ้งให้เราทราบ โปรดส่งคำขอในเครื่องมือติดตามปัญหา