JavaScript मेज़रमेंट स्निपेट की आखिरी लाइन, ga() कमांड सूची में send कमांड जोड़ती है, ताकि Google Analytics को पेजव्यू भेजा जा सके:
ga('create', 'UA-XXXXX-Y', 'auto');
ga('send', 'pageview');
भेजने वाला ऑब्जेक्ट एक ट्रैकर है, जिसे कोड की पिछली लाइन में बनाने के लिए शेड्यूल किया गया था. साथ ही, भेजा जाने वाला डेटा, ट्रैकर पर सेव किया गया डेटा होता है.
इस गाइड में, Google Analytics को डेटा भेजने के अलग-अलग तरीके बताए गए हैं. साथ ही, भेजे जाने वाले डेटा को कंट्रोल करने का तरीका भी बताया गया है.
हिट, हिट टाइप, और मेज़रमेंट प्रोटोकॉल
जब कोई ट्रैकर Google Analytics को डेटा भेजता है, तो उसे हिट भेजना कहा जाता है. साथ ही, हर हिट का एक हिट टाइप होना चाहिए. Google Analytics टैग pageview टाइप का हिट भेजता है. अन्य हिट टाइप में screenview, event, transaction, item, social, exception, और timing शामिल हैं. यह गाइड सभी हिट टाइप के लिए आम तौर पर इस्तेमाल होने वाले कॉन्सेप्ट और तरीकों के बारे में बताती है. बाईं ओर मौजूद नेविगेशन में, सामान्य उपयोगकर्ता इंटरैक्शन को मेज़र करना सेक्शन में, हर हिट टाइप की अलग-अलग गाइड देखी जा सकती है.
हिट एक एचटीटीपी अनुरोध होता है. इसमें फ़ील्ड और वैल्यू पेयर शामिल होते हैं, जिन्हें क्वेरी स्ट्रिंग के तौर पर एन्कोड किया जाता है और मेज़रमेंट प्रोटोकॉल को भेजा जाता है.
analytics.js का इस्तेमाल करने वाला पेज लोड होने पर, अगर आपके ब्राउज़र के डेवलपर टूल खुले रहते हैं, तो नेटवर्क टैब में भेजे जा रहे हिट देखे जा सकते हैं. google-analytics.com/collect को भेजे गए अनुरोध देखें.
कौनसा डेटा भेजा जाता है
मेज़रमेंट प्रोटोकॉल को हिट भेजते समय, ट्रैकर उन सभी फ़ील्ड को भेजते हैं जो मौजूदा समय में सेव किए गए हैं और मान्य मेज़रमेंट प्रोटोकॉल पैरामीटर हैं. उदाहरण के लिए, title और location जैसे फ़ील्ड भेजे जाते हैं, लेकिन cookieDomain और hitCallback नहीं भेजे जाते.
कुछ मामलों में, आप मौजूदा हिट के लिए Google Analytics को फ़ील्ड भेजना चाहते हैं, लेकिन बाद के किसी भी हिट के लिए नहीं. उदाहरण के लिए, ऐसा इवेंट हिट जिसमें eventAction और eventLabel फ़ील्ड सिर्फ़ मौजूदा हिट के लिए काम के होते हैं.
सिर्फ़ मौजूदा हिट वाले फ़ील्ड भेजने के लिए, उन्हें send तरीके में आर्ग्युमेंट के तौर पर भेजा जा सकता है. बाद के सभी हिट के साथ फ़ील्ड डेटा भेजने के लिए, आपको set तरीके का इस्तेमाल करके ट्रैकर को अपडेट करना होगा.
भेजने का तरीका
ट्रैकर के send तरीके को सीधे ट्रैकर ऑब्जेक्ट पर ही कॉल किया जा सकता है. इसके अलावा, इसे ga() कमांड सूची में send कमांड जोड़कर भी कॉल किया जा सकता है. आम तौर पर आपके पास ट्रैकर ऑब्जेक्ट का रेफ़रंस नहीं होता है. इसलिए, Google Analytics को ट्रैकर का डेटा भेजने के लिए, हमारा सुझाव है कि आप ga() कमांड सूची का इस्तेमाल करें.
ga() कमांड सूची का इस्तेमाल किया जा रहा है
ga() कमांड सूची में send निर्देश जोड़ने के लिए, हस्ताक्षर इस तरह किए गए हैं:
ga('[trackerName.]send', [hitType], [...fields], [fieldsObject]);
जैसा कि ऊपर बताया गया है, hitType, ...fields, और fieldsObject पैरामीटर में तय की गई वैल्यू, सिर्फ़ मौजूदा हिट के लिए भेजी जाती हैं. वे न तो ट्रैकर ऑब्जेक्ट में सेव होते हैं और न ही बाद में मिलने वाले हिट के साथ भेजे जाते हैं.
अगर send निर्देश के साथ पास किया गया कोई भी फ़ील्ड, ट्रैकर ऑब्जेक्ट पर पहले से सेट है, तो निर्देश में पास की जाने वाली वैल्यू का इस्तेमाल, ट्रैकर पर सेव की गई वैल्यू के बजाय किया जाएगा.
send कमांड पर किए जाने वाले कॉल में एक hitType शामिल होना चाहिए. साथ ही, उसके टाइप के आधार पर, अन्य पैरामीटर की भी ज़रूरत पड़ सकती है. ज़्यादा जानकारी के लिए, बाईं ओर मौजूद नेविगेशन में, उपयोगकर्ता के सामान्य इंटरैक्शन को मेज़र करने के लिए, अलग-अलग गाइड देखें.
सभी हिट टाइप के लिए काम करने वाले send कमांड का इस्तेमाल करने का सबसे आसान तरीका, fieldsObject पैरामीटर का इस्तेमाल करके सभी फ़ील्ड को पास करना है. उदाहरण के लिए:
ga('send', {
hitType: 'event',
eventCategory: 'Video',
eventAction: 'play',
eventLabel: 'cats.mp4'
});
सुविधा के लिए, कुछ हिट टाइप आम तौर पर इस्तेमाल किए जाने वाले फ़ील्ड को सीधे send कमांड में आर्ग्युमेंट के तौर पर भेजने की अनुमति देते हैं. उदाहरण के लिए, "इवेंट" हिट टाइप के लिए ऊपर दिए गए send कमांड को इस तरह से फिर से लिखा जा सकता है:
ga('send', 'event', 'Video', 'play', 'cats.mp4');
यह जानने के लिए कि अलग-अलग हिट टाइप के लिए, कौनसे फ़ील्ड आर्ग्युमेंट के तौर पर भेजे जा सकते हैं, ईमेल भेजने के तरीके के रेफ़रंस का "पैरामीटर" सेक्शन देखें.
नाम वाले ट्रैकर का इस्तेमाल करना
अगर डिफ़ॉल्ट ट्रैकर के बजाय, नाम वाले ट्रैकर का इस्तेमाल किया जा रहा है, तो कमांड स्ट्रिंग में उसका नाम पास किया जा सकता है.
"myTracker" नाम के ट्रैकर पर, इन send कमांड को कॉल किया जाएगा:
ga('myTracker.send', 'event', 'Video', 'play', 'cats.mp4');
ट्रैकर ऑब्जेक्ट पर ही
अगर आपके पास ट्रैकर ऑब्जेक्ट का रेफ़रंस है, तो उस ट्रैकर के send तरीके को सीधे कॉल किया जा सकता है:
ga(function(tracker) {
tracker.send('event', 'Video', 'play', 'cats.mp4');
});
यह पता करना कि हिट कब भेजा गया है
कुछ मामलों में, आपको यह जानने की ज़रूरत होगी कि कोई हिट Google Analytics को कब भेजा जाता है, ताकि आप उसके तुरंत बाद कार्रवाई कर सकें. यह आम बात है, जब आपको किसी ऐसे इंटरैक्शन को रिकॉर्ड करने की ज़रूरत होती है जो उपयोगकर्ता को मौजूदा पेज से दूर ले जाता है. पेज के अनलोड होते ही कई ब्राउज़र JavaScript का इस्तेमाल करना बंद कर देते हैं. इसका मतलब है कि हिट भेजने के लिए आपके analytics.js निर्देश शायद कभी न चलें.
इसका एक उदाहरण यह है कि जब आपको Google Analytics को कोई इवेंट भेजना हो, ताकि यह रिकॉर्ड किया जा सके कि किसी उपयोगकर्ता ने फ़ॉर्म के 'सबमिट करें' बटन पर क्लिक किया है. ज़्यादातर मामलों में, 'सबमिट करें' बटन पर क्लिक करने से अगला पेज तुरंत लोड होना शुरू हो जाएगा और कोई भी ga('send', ...) निर्देश नहीं चलेगा.
इसका समाधान यह है कि पेज को अनलोड होने से रोकने के लिए, इवेंट को रोका जाए. इसके बाद, हमेशा की तरह Google Analytics को अपना हिट भेजा जा सकता है और हिट भेजे जाने के बाद, फ़ॉर्म को प्रोग्राम के हिसाब से दोबारा सबमिट किया जा सकता है.
hitCallback
हिट भेज दिए जाने पर सूचना पाने के लिए, आपको hitCallback फ़ील्ड सेट करना होगा. hitCallback एक फ़ंक्शन है, जिसे हिट भेजते ही कॉल किया जाता है.
नीचे दिए गए उदाहरण में, फ़ॉर्म की डिफ़ॉल्ट सबमिट कार्रवाई को रद्द करने, Google Analytics को हिट भेजने, और फिर hitCallback फ़ंक्शन का इस्तेमाल करके फ़ॉर्म को फिर से सबमिट करने का तरीका बताया गया है:
// Gets a reference to the form element, assuming
// it contains the id attribute "signup-form".
var form = document.getElementById('signup-form');
// Adds a listener for the "submit" event.
form.addEventListener('submit', function(event) {
// Prevents the browser from submitting the form
// and thus unloading the current page.
event.preventDefault();
// Sends the event to Google Analytics and
// resubmits the form once the hit is done.
ga('send', 'event', 'Signup Form', 'submit', {
hitCallback: function() {
form.submit();
}
});
});
हैंडलिंग के टाइम आउट
ऊपर दिया गया उदाहरण अच्छी तरह से काम करता है, लेकिन इसमें एक गंभीर समस्या है. अगर (किसी भी वजह से) analytics.js लाइब्रेरी लोड नहीं हो पाती है, तो hitCallback फ़ंक्शन कभी नहीं चलेगा. अगर hitCallback फ़ंक्शन कभी नहीं चलता है, तो उपयोगकर्ता कभी भी फ़ॉर्म सबमिट नहीं कर पाएंगे.
जब भी आप hitCallback फ़ंक्शन में साइट के ज़रूरी फ़ंक्शन डालते हैं, तो आपको हमेशा टाइम आउट फ़ंक्शन का इस्तेमाल करना चाहिए. इसकी मदद से, उन मामलों को हैंडल किया जा सकता है जहां analytics.js लाइब्रेरी लोड नहीं हो पाती.
अगला उदाहरण टाइम आउट का इस्तेमाल करने के लिए ऊपर दिए गए कोड को अपडेट करता है. अगर उपयोगकर्ता के 'सबमिट करें' बटन पर क्लिक करने के एक सेकंड बाद भी hitCallback नहीं चलता है, तो फ़ॉर्म फिर से सबमिट हो जाता है.
// Gets a reference to the form element, assuming
// it contains the id attribute "signup-form".
var form = document.getElementById('signup-form');
// Adds a listener for the "submit" event.
form.addEventListener('submit', function(event) {
// Prevents the browser from submitting the form
// and thus unloading the current page.
event.preventDefault();
// Creates a timeout to call `submitForm` after one second.
setTimeout(submitForm, 1000);
// Keeps track of whether or not the form has been submitted.
// This prevents the form from being submitted twice in cases
// where `hitCallback` fires normally.
var formSubmitted = false;
function submitForm() {
if (!formSubmitted) {
formSubmitted = true;
form.submit();
}
}
// Sends the event to Google Analytics and
// resubmits the form once the hit is done.
ga('send', 'event', 'Signup Form', 'submit', {
hitCallback: submitForm
});
});
अगर आपकी साइट में कई जगहों पर ऊपर दिए गए पैटर्न का इस्तेमाल किया जा रहा है, तो टाइम आउट मैनेज करने के लिए यूटिलिटी फ़ंक्शन बनाना शायद आसान हो.
नीचे दिया गया यूटिलिटी फ़ंक्शन, किसी फ़ंक्शन को इनपुट के तौर पर स्वीकार करता है और नया फ़ंक्शन दिखाता है. अगर लौटाए गए फ़ंक्शन को टाइम आउट की अवधि (डिफ़ॉल्ट टाइम आउट एक सेकंड का समय) से पहले कॉल किया जाता है, तो यह टाइम आउट को हटा देता है और इनपुट फ़ंक्शन को शुरू करता है. अगर रिटर्न किए गए फ़ंक्शन को टाइम आउट की अवधि से पहले कॉल नहीं किया जाता, तो इनपुट फ़ंक्शन को इस बात पर ध्यान दिए बिना कॉल किया जाता है.
function createFunctionWithTimeout(callback, opt_timeout) {
var called = false;
function fn() {
if (!called) {
called = true;
callback();
}
}
setTimeout(fn, opt_timeout || 1000);
return fn;
}
अब सभी hitCallback फ़ंक्शन को टाइम आउट के साथ आसानी से रैप किया जा सकता है, ताकि यह पक्का किया जा सके कि आपकी साइट उम्मीद के मुताबिक काम करे, भले ही आपकी साइट हिट न भेज पाएं या analytics.js लाइब्रेरी कभी लोड न हो.
// Gets a reference to the form element, assuming
// it contains the id attribute "signup-form".
var form = document.getElementById('signup-form');
// Adds a listener for the "submit" event.
form.addEventListener('submit', function(event) {
// Prevents the browser from submitting the form
// and thus unloading the current page.
event.preventDefault();
// Sends the event to Google Analytics and
// resubmits the form once the hit is done.
ga('send', 'event', 'Signup Form', 'submit', {
hitCallback: createFunctionWithTimeout(function() {
form.submit();
})
});
});
परिवहन के अलग-अलग तरीके तय करना
डिफ़ॉल्ट रूप से, analytics.js एचटीटीपी तरीका और ट्रांसपोर्ट का वह तरीका चुनता है जिसकी मदद से बेहतर तरीके से हिट भेजे जा सकते हैं. ये तीन विकल्प हैं: 'image' (Image ऑब्जेक्ट का इस्तेमाल करके), 'xhr' (XMLHttpRequest ऑब्जेक्ट का इस्तेमाल करके) या 'beacon' navigator.sendBeacon तरीके का इस्तेमाल करके.
पिछले दो तरीकों से, पिछले सेक्शन में बताई गई समस्या के बारे में पता चलता है. जब पेज अनलोड हो रहा हो, तो अक्सर हिट नहीं भेजे जाते. इसके उलट, navigator.sendBeacon तरीका, एचटीएमएल की एक नई सुविधा है, जिसे इस समस्या को हल करने के लिए बनाया गया है.
अगर आपके उपयोगकर्ता का ब्राउज़र navigator.sendBeacon पर काम करता है, तो 'beacon' को transport तरीके के तौर पर बताया जा सकता है. साथ ही, हिट कॉलबैक सेट करने के बारे में चिंता करने की ज़रूरत नहीं है.
यह कोड, उन ब्राउज़र में ट्रांसपोर्ट के तरीके को 'beacon' पर सेट करता है जो यह सुविधा देते हैं.
ga('create', 'UA-XXXXX-Y', 'auto');
// Updates the tracker to use `navigator.sendBeacon` if available.
ga('set', 'transport', 'beacon');
अगले चरण
कुछ खास तरह के उपयोगकर्ता इंटरैक्शन को मेज़र करने के लिए, कभी-कभी मुश्किल तरीकों को लागू करना पड़ सकता है. हालांकि, कई मामलों में इन्हें पहले ही डेवलप किया जा चुका है और analytics.js प्लगिन के तौर पर उपलब्ध कराया जा चुका है. अगली गाइड, ga() कमांड सूची के साथ analytics.js प्लगिन का इस्तेमाल करने का तरीका बताती है.