JavaScript ölçüm snippet'inin son satırı, Google Analytics'e bir sayfa görüntüleme göndermek için ga()
komut sırasına bir send
komutu ekler:
ga('create', 'UA-XXXXX-Y', 'auto'); ga('send', 'pageview');
Gönderme işlemini yapan nesne, önceki kod satırında oluşturulmak üzere planlanmış izleyicidir. Gönderilen veriler ise 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
yer alır. Bu kılavuzda, tüm isabet türlerinde ortak olan kavram ve yöntemler özetlenmektedir. Her isabet türü için ayrı ayrı kılavuzlar, sol taraftaki gezinme menüsündeki Yaygın kullanıcı etkileşimlerini ölçme bölümünde 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
hedefine gönderilen istekleri arayın.
Hangi veriler gönderilir?
Measurement Protocol'e isabet gönderirken izleyiciler, şu anda depolanan 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, geçerli isabet için Google Analytics'e alanlar göndermek ancak daha sonraki isabetler için göndermemek istersiniz. eventAction
ve eventLabel
alanlarının yalnızca mevcut isabetle alakalı olduğu bir etkinlik isabeti buna örnek olarak gösterilebilir.
Yalnızca geçerli isabet içeren alanları göndermek için bunları send
yöntemine bağımsız değişken olarak aktarabilirsiniz. Sonraki tüm isabetlerle birlikte alan verilerinin 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ınız olmadığından, izleyici verilerini Google Analytics'e göndermek için ga()
komut sırasının kullanılması önerilir.
ga()
komut sırasını kullanma
ga()
komut sırasına bir send
komutu eklemek için kullanılan 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 zaten 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 fazla bilgi edinmek için sol taraftaki gezinme menüsünde yer alan yaygın kullanıcı etkileşimlerini ölçme konulu bağımsız rehberlere 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 doğrudan send
komutuna bağımsız değişken olarak iletilmesine izin verir. Örneğin, "etkinlik" isabet türü için yukarıdaki send
komutu şu şekilde yeniden yazılabilir:
ga('send', 'event', 'Video', 'play', 'cats.mp4');
Çeşitli isabet türlerinin bağımsız değişkeni 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ış bir izleyiciyi kullanma
Varsayılan izleyici yerine adlandırılmış bir izleyici kullanıyorsanız izleyicinin adını komut dizesinde geçirebilirsiniz.
"myTracker" adlı izleyicide aşağıdaki send
komutu çağrılacaktır:
ga('myTracker.send', 'event', 'Video', 'play', 'cats.mp4');
Takip cihazı üzerinde
Takip 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 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 yürütmeyi durdurur. Bu nedenle, isabet göndermek için analytics.js komutlarınız hiçbir zaman çalışmayabilir.
Bu duruma ö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ğinizde verilebilir. Çoğu durumda, gönder düğmesi tıklandığında sonraki sayfa hemen yüklenmeye başlar ve ga('send', ...)
komutları çalışmaz.
Bu sorunun çözümü, sayfanın yüklenmesini durdurmak için etkinliğe müdahale etmektir. Daha sonra, isabetinizi her zamanki gibi Google Analytics'e gönderebilir ve isabetin gönderilmesi tamamlandıktan sonra formu programlı bir şekilde yeniden gönderebilirsiniz.
hitCallback
İsabet gönderimi 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şlevini kullanarak formu nasıl yeniden göndereceğiniz 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ı işleme
Yukarıdaki örnek gayet mantıklı, ancak ciddi bir sorunu var. Herhangi bir nedenle analytics.js kitaplığı yüklenemezse hitCallback
işlevi hiçbir zaman çalışmaz. Ayrıca hitCallback
işlevi hiç çalışmazsa kullanıcılar hiçbir zaman formu gönderemez.
hitCallback
işlevine 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 zaman aşımı kullanılacak şekilde güncellenir. Kullanıcı gönder düğmesini tıklamasından sonra bir saniye geçerse ve 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 alacak bir yardımcı program işlevi oluşturmak muhtemelen daha kolay olur.
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;
}
İsabetlerinizin 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 artık tüm hitCallback
işlevlerini bir 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 iyi şekilde gönderileceği HTTP yöntemini ve taşıma mekanizmasını seçer. Üç seçenek, 'image'
(Image
nesnesi kullanarak), 'xhr'
(XMLHttpRequest
nesnesi kullanarak) veya yeni navigator.sendBeacon
yöntemini kullanan 'beacon'
şeklindedir.
İlk iki yöntem, önceki bölümde açıklanan sorunu paylaşır (bu bölümde sayfa kaldırılırsa isabetler genellikle gönderilmez). Buna karşın navigator.sendBeacon
yöntemi, bu sorunu çözmek için oluşturulan yeni bir HTML özelliğidir.
Kullanıcınızın tarayıcısı navigator.sendBeacon
özelliğini destekliyorsa, transport
mekanizması olarak 'beacon'
öğesini belirtebilirsiniz. Böylece, isabet geri çağırma işlevi ayarlama konusunda endişelenmenize gerek kalmaz.
Aşağıdaki kod, taşıma mekanizmasını, destekleyen tarayıcılarda '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. Bir sonraki kılavuzda, ga()
komut sırası ile analytics.js eklentilerinin nasıl kullanılacağı açıklanmaktadır.