ऑफ़लाइन Google Analytics का इस्तेमाल करना हुआ अब और आसान

अब आपके पास एक ऐसा प्रोग्रेसिव वेब ऐप्लिकेशन है जिसमें सर्विस वर्कर की सुविधा है, जो ऑफ़लाइन मोड में भी काम करने की सुविधा देता है. बढ़िया! आपके वेब ऐप्लिकेशन के लिए, मौजूदा Google Analytics भी सेट अप है. अगर आपके ऑफ़लाइन काम के लिए, डेटा के विश्लेषण से जुड़ी कोई अहम जानकारी मिलती है, तो यह ज़रूरी नहीं है. हालांकि, अगर ऑफ़लाइन रहते हुए Google Analytics को डेटा भेजने की कोशिश की जाती है, तो वे अनुरोध पूरे नहीं हो पाएंगे और डेटा गायब हो जाएगा.

इसका समाधान सर्विस वर्कर हैं. आपको यह जानकर हैरानी नहीं होगी! खास तौर पर, यह आपके सर्विस वर्कर में कोड जोड़ रहा है, ताकि Google Analytics के अनुरोध (IndexedDB का इस्तेमाल करके) स्टोर किए जा सकें और नेटवर्क उपलब्ध होने पर, बाद में उनका फिर से इस्तेमाल किया जा सके. हमने इस लॉजिक को ओपन सोर्स Google I/O वेब ऐप्लिकेशन के हिस्से के तौर पर मैनेज करने के लिए, कोड शेयर किया. हालांकि, हमने यह महसूस किया कि यह एक मददगार पैटर्न था. साथ ही, कोड को कॉपी करके चिपकाना नाज़ुक हो सकता है.

आज हमें यह घोषणा करते हुए खुशी हो रही है कि आपके सर्विस वर्कर में ऑफ़लाइन Google Analytics अनुरोधों को हैंडल करने के लिए सभी ज़रूरी चीज़ें, npm पैकेज में बंडल कर दी गई हैं: npm install --save-dev sw-offline-google-analytics

sw-ऑफ़लाइन-google-analytics का इस्तेमाल करना

अपने मौजूदा सर्विस वर्कर कोड में से, यह जोड़ें:

// 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 इवेंट हैंडलर सेट अप करता है, जो Google Analytics डोमेन पर किए गए अनुरोधों का जवाब देता है. (लाइब्रेरी, Google Analytics से बाहर के अनुरोधों को अनदेखा करती है. इससे आपके सर्विस वर्कर के अन्य fetch इवेंट हैंडलर को उन संसाधनों के लिए सही रणनीतियां लागू करने का मौका मिलता है.) यह सबसे पहले नेटवर्क के ख़िलाफ़ अनुरोध पूरा करने की कोशिश करेगा. अगर उपयोगकर्ता ऑनलाइन है, तो सामान्य तरीके से पेमेंट करता रहेगा.

अगर नेटवर्क का अनुरोध पूरा नहीं हो पाता है, तो लाइब्रेरी, IndexedDB को किए गए अनुरोध से जुड़ी जानकारी अपने-आप सेव करेगी. साथ ही, एक टाइमस्टैंप भी सेव होगा, जो दिखाएगा कि अनुरोध कब किया गया था. जब भी आपका सर्विस वर्कर शुरू होता है, तब लाइब्रेरी लाइन में शामिल अनुरोधों की जांच करेगी और उन्हें फिर से भेजने की कोशिश के साथ-साथ कुछ दूसरे Google Analytics पैरामीटर की भी कोशिश करेगी:

  • qt पैरामीटर, उस समय पर सेट होता है जो अनुरोध किए जाने के बाद से लेकर अब तक बीत चुका है. इससे यह पक्का किया जाता है कि ओरिजनल समय को सही तरीके से एट्रिब्यूट किया गया हो.
  • goog.offlineGoogleAnalytics.initialize() को पास किए गए कॉन्फ़िगरेशन ऑब्जेक्ट की parameterOverrides प्रॉपर्टी में दिए गए कोई भी अतिरिक्त पैरामीटर और वैल्यू. उदाहरण के लिए, सर्विस वर्कर से तुरंत भेजे गए अनुरोधों और सर्विस वर्कर से दोबारा भेजे गए अनुरोधों के बीच अंतर करने के लिए, कस्टम डाइमेंशन शामिल किया जा सकता है.

अगर फिर से अनुरोध भेजने का फ़ैसला आपके हक में आता है, तो अच्छी बात है! अनुरोध को IndexedDB से हटा दिया गया है. अगर फिर से कोशिश नहीं की जा सकती और शुरुआती अनुरोध 24 घंटे से कम समय में किया गया है, तो इसे IndexedDB में रखा जाएगा. इसके बाद, सर्विस वर्कर के अगली बार चालू होने पर फिर से कोशिश की जाएगी. आपको ध्यान देना चाहिए कि Google Analytics के चार घंटे से पहले के हिट प्रोसेस होने की गारंटी नहीं है, लेकिन "ज़रूरत पड़ने पर" के कुछ पुराने हिट दोबारा भेजने से कोई परेशानी नहीं होती.

sw-offline-google-analytics, Google Analytics को बूटस्ट्रैप करने के लिए ज़रूरी analytics.js JavaScript कोड के लिए, "नेटवर्क पहले, कैश मेमोरी पर वापस जाना" रणनीति को भी implements.

अभी बहुत कुछ होना बाकी है!

sw-offline-google-analytics, sw-helpers के बड़े प्रोजेक्ट का हिस्सा है, जो लाइब्रेरी का कलेक्शन है. इसका मकसद, मौजूदा सर्विस वर्कर इंप्लिमेंटेशन में ड्रॉप-इन सुधारों की सुविधा देना है.

साथ ही, उस प्रोजेक्ट का हिस्सा sw-appcache-behavior है. यह एक लाइब्रेरी है जो सर्विस वर्कर के अंदर मौजूदा Appcache मेनिफ़ेस्ट में बताई गई कैश मेमोरी की रणनीतियों को लागू करती है. इसका मकसद, ऐप्लिकेशन कैश मेमोरी से, सेवा देने वाले कर्मचारियों पर माइग्रेट करने में आपकी मदद करना है. साथ ही, शुरुआत में कैश मेमोरी में डेटा सेव करने की एक जैसी रणनीति बनाए रखनी है.

अगर आपके पास लाइब्रेरी के अन्य आइडिया हैं, तो हमें आपके विचार जानने में खुशी होगी. इसलिए, कृपया समस्या को ट्रैक करने वाले टूल में अनुरोध करें!