JavaScript ölçüm snippet'inin son satırı, ga() komut sırasına bir send komutu ekleyerek Google Analytics'e bir sayfa görüntüleme gönderir:
ga('create', 'UA-XXXXX-Y', 'auto');
ga('send', 'pageview');
Gönderme işlemini yapan nesne, önceki kod satırında oluşturulmak üzere programlanmış izleyicidir ve gönderilen veriler, bu izleyicide depolanan verilerdir.
Bu kılavuzda, Google Analytics'e veri göndermenin çeşitli yolları ve hangi verilerin gönderileceğini nasıl kontrol edeceğiniz açıklanmaktadır.
İsabetler, isabet türleri ve Measurement Protocol
Bir izleyici Google Analytics'e veri gönderdiğinde buna isabet gönderme adı verilir ve her isabetin bir isabet türü olmalıdır. Google Analytics etiketi pageview türünde bir isabet gönderir. Diğer isabet türleri arasında screenview, event, transaction, item, social, exception ve timing bulunur. Bu kılavuzda, tüm isabet türlerinde yaygın olarak kullanılan kavram ve yöntemler özetlenmektedir. Her isabet türü için ayrı ayrı kılavuzlar, sol taraftaki gezinme panelinde yer alan Yaygın kullanıcı etkileşimlerini ölçme altında bulunabilir.
İsabet, sorgu dizesi olarak kodlanan ve Measurement Protocol'a gönderilen alan ve değer çiftlerinden oluşan bir HTTP isteğidir.
analytics.js kullanan bir sayfayı yüklerken tarayıcınızın geliştirici araçları açıksa, gönderilen isabetleri ağ sekmesinde görebilirsiniz. google-analytics.com/collect adresine gönderilen istekleri arayın.
Hangi veriler gönderilir?
Measurement Protocol'a isabet gönderirken izleyiciler, hâlihazırda depolanmış olan ve geçerli Measurement Protocol parametreleri olan tüm alanları gönderir. Örneğin, title ve location gibi alanlar gönderilir ancak cookieDomain ve hitCallback gönderilmez.
Bazı durumlarda, sonraki isabetler için değil, geçerli isabet için Google Analytics'e alanlar göndermek istersiniz. Buna örnek olarak, eventAction ve eventLabel alanlarının yalnızca mevcut isabetle alakalı olduğu bir etkinlik isabeti verilebilir.
Yalnızca geçerli isabet içeren alanları göndermek için bunları send yöntemine bağımsız değişken olarak aktarabilirsiniz. Alan verilerinin sonraki tüm isabetlerle birlikte gönderilmesini sağlamak için set yöntemini kullanarak izleyiciyi güncellemeniz gerekir.
Gönderme yöntemi
Bir izleyicinin send yöntemi, doğrudan izleyici nesnesinin kendisinde veya ga() komut sırasına bir send komutu eklenerek çağrılabilir. Çoğu zaman izleyici nesnesine referans vermediğinizden, izleyici verilerini Google Analytics'e göndermek için önerilen yol ga() komut sırasının kullanılmasıdır.
ga() komut sırasını kullanma
ga() komut sırasına send komutu eklemek için gereken imza aşağıdaki gibidir:
ga('[trackerName.]send', [hitType], [...fields], [fieldsObject]);
Yukarıda belirtildiği gibi, hitType, ...fields ve fieldsObject parametrelerinde aracılığıyla belirtilen değerler yalnızca geçerli isabet için gönderilir. Bunlar, izleyici nesnesinde depolanmaz veya sonraki isabetlerle birlikte gönderilmez.
send komutuyla iletilen alanlardan herhangi biri izleyici nesnesinde önceden ayarlanmışsa izleyici nesnesinde depolanan değerler yerine komutta iletilen değerler kullanılır.
send komutuna yapılan çağrılar bir hitType belirtmelidir ve belirtilen türe bağlı olarak başka parametreler de gerekli olabilir. Daha ayrıntılı bilgi için sol taraftaki gezinme menüsünde bulunan yaygın kullanıcı etkileşimlerini ölçme ile ilgili bağımsız kılavuzlara bakın.
Tüm isabet türlerinde işe yarayan send komutunu kullanmanın en basit yolu, tüm alanları fieldsObject parametresini kullanarak geçirmektir. Örneğin:
ga('send', {
hitType: 'event',
eventCategory: 'Video',
eventAction: 'play',
eventLabel: 'cats.mp4'
});
Kolaylık sağlaması açısından, belirli isabet türleri, yaygın olarak kullanılan alanların send komutuna doğrudan bağımsız değişken olarak aktarılmasına olanak tanır. Örneğin, yukarıdaki send komutu "etkinlik" isabet türü için şu şekilde yeniden yazılabilir:
ga('send', 'event', 'Video', 'play', 'cats.mp4');
Çeşitli isabet türleri için bağımsız değişken olarak iletilebilecek alanların tam listesi için gönderme yöntemi referansının "parametreler" bölümüne bakın.
Adlandırılmış izleyici kullanma
Varsayılan izleyici yerine adlandırılmış bir izleyici kullanıyorsanız izleyicinin adını komut dizesinde iletebilirsiniz.
"myTracker" adlı izleyicide aşağıdaki send komutu çağrılır:
ga('myTracker.send', 'event', 'Video', 'play', 'cats.mp4');
Takip nesnesinin kendisinde
İzleyici nesnesine referansınız varsa doğrudan bu izleyicinin send yöntemini çağırabilirsiniz:
ga(function(tracker) {
tracker.send('event', 'Video', 'play', 'cats.mp4');
});
İsabetin ne zaman gönderildiğini öğrenme
Bazı durumlarda, Google Analytics'e bir isabetin ne zaman gönderildiğini bilmeniz gerekir. Böylece, hemen sonra işlem yapabilirsiniz. Bu durum, kullanıcıyı geçerli sayfadan başka bir yere götürecek belirli bir etkileşimi kaydetmeniz gerektiğinde sık karşılaşılan bir durumdur. Birçok tarayıcı, sayfa yüklenmeye başlar başlamaz JavaScript'i çalıştırmayı durdurur. Bu nedenle, isabet göndermek için kullanılan analytics.js komutlarınız hiçbir zaman çalışmayabilir.
Buna örnek olarak, kullanıcının bir formun gönder düğmesini tıkladığını kaydetmek için Google Analytics'e etkinlik göndermek istediğiniz durumlar verilebilir. Çoğu durumda, gönder düğmesi tıklandığında sonraki sayfa yüklenmeye başlar ve ga('send', ...) komutları çalışmaz.
Bu sorun, sayfanın yüklenmesinin durdurulması için etkinliğe müdahale etmektir. Daha sonra, isabetinizi her zamanki gibi Google Analytics'e gönderebilir ve isabet gönderildikten sonra, formu programlı bir şekilde yeniden gönderebilirsiniz.
hitCallback
İsabet gönderme işlemi tamamlandığında bildirim almak için hitCallback alanını ayarlarsınız. hitCallback, isabet başarıyla gönderilir gönderilmez çağrılan bir işlevdir.
Aşağıdaki örnekte, bir formun varsayılan gönderme işlemini nasıl iptal edeceğiniz, Google Analytics'e nasıl isabet göndereceğiniz ve ardından hitCallback işlevi kullanılarak formun nasıl yeniden gönderileceği gösterilmektedir:
// 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();
}
});
});
Zaman aşımlarını yönetme
Yukarıdaki örnek uygundur, ancak önemli bir sorunu vardır. Herhangi bir nedenle analytics.js kitaplığı yüklenemezse hitCallback işlevi hiçbir zaman çalışmaz. hitCallback işlevi hiç çalışmazsa kullanıcılar hiçbir zaman formu gönderemez.
hitCallback işlevinin içine kritik site işlevselliği koyduğunuzda analytics.js kitaplığının yüklenemediği durumları ele almak için her zaman bir zaman aşımı işlevi kullanmanız gerekir.
Sıradaki örnekte, yukarıdaki kod bir zaman aşımı kullanacak şekilde güncellenir. Kullanıcı gönder düğmesini tıkladıktan bir saniye sonra hitCallback çalışmazsa form yine de yeniden gönderilir.
// 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
});
});
Yukarıdaki kalıbı sitenizdeki birçok yerde kullanıyorsanız, zaman aşımlarını ele alan bir yardımcı program işlevi oluşturmak muhtemelen daha kolay olacaktır.
Aşağıdaki yardımcı program işlevi, bir işlevi girdi olarak kabul eder ve yeni bir işlev döndürür. Döndürülen işlev zaman aşımı süresinden önce çağrılırsa (varsayılan zaman aşımı bir saniyedir) zaman aşımını temizler ve giriş işlevini çağırır. Döndürülen işlev zaman aşımı süresinden önce çağrılmazsa giriş işlevi yine de çağrılır.
function createFunctionWithTimeout(callback, opt_timeout) {
var called = false;
function fn() {
if (!called) {
called = true;
callback();
}
}
setTimeout(fn, opt_timeout || 1000);
return fn;
}
Artık isabetlerinizin gönderilemediği veya analytics.js kitaplığının hiç yüklenmediği durumlarda sitenizin beklendiği gibi çalışmasını sağlamak için tüm hitCallback işlevlerini zaman aşımı ile kolayca sarmalayabilirsiniz.
// 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();
})
});
});
Farklı taşıma mekanizmaları belirtme
Varsayılan olarak, analytics.js, isabetlerin en uygun şekilde gönderilmesi için HTTP yöntemini ve aktarım mekanizmasını seçer. Üç seçenek şunlardır: 'image' (Image nesnesi kullanarak), 'xhr' (XMLHttpRequest nesnesi kullanarak) veya yeni navigator.sendBeacon yöntemi kullanılan 'beacon'.
Önceki iki yöntem, önceki bölümde açıklanan sorunu paylaşır (burada, sayfa kaldırılırken isabetler genellikle gönderilmez). Buna karşılık navigator.sendBeacon yöntemi, bu sorunu çözmek için oluşturulmuş yeni bir HTML özelliğidir.
Kullanıcınızın tarayıcısı navigator.sendBeacon protokolünü destekliyorsa, transport mekanizması olarak 'beacon' öğesini belirtebilirsiniz ve bir isabet geri çağırma ayarlama konusunda endişelenmenize gerek yoktur.
Aşağıdaki kod, destekleyen tarayıcılarda taşıma mekanizmasını 'beacon' değerine ayarlar.
ga('create', 'UA-XXXXX-Y', 'auto');
// Updates the tracker to use `navigator.sendBeacon` if available.
ga('set', 'transport', 'beacon');
Sonraki adımlar
Belirli kullanıcı etkileşimi türlerini ölçmek bazen karmaşık uygulamalar gerektirebilir. Ancak, birçok durumda bu uygulamalar hâlihazırda geliştirilmiş ve analytics.js eklentileri olarak kullanıma sunulmuştur. Sonraki kılavuzda, ga() komut sırası ile analytics.js eklentilerinin nasıl kullanılacağı açıklanmaktadır.