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öndermeyi yapan nesne, önceki kod satırında oluşturulmak üzere programlanan izleyicidir. Gönderilen veriler ise bu izleyicide depolanan verilerdir.
Bu kılavuzda, Google Analytics'e veri göndermenin çeşitli yolları ve gönderilen verilerin nasıl kontrol edileceği açıklanmaktadır.
İsabetler, isabet türleri ve Measurement Protocol
İzleyici 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 isabet türü 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ürleri için yaygın olarak kullanılan kavram ve yöntemler özetlenmiştir. Her bir isabet türüne ilişkin bağımsız kılavuzları sol taraftaki gezinme menüsünde Sık kullanılan kullanıcı etkileşimlerini ölçme bölümünün altında bulabilirsiniz.
İ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 sayfa yüklendiğinde tarayıcınızın geliştirici araçları açıksa, isabetlerin ağ sekmesinde gönderildiğini görebilirsiniz. google-analytics.com/collect için gönderilen istekleri arayın.
Hangi veriler gönderilir?
Measurement Protocol'a isabet gönderilirken 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, mevcut isabet için Google Analytics'e alan göndermek, ancak sonraki isabetler için göndermek istemezsiniz. eventAction ve eventLabel alanlarının yalnızca mevcut isabetle alakalı olduğu bir etkinlik isabeti buna örnek gösterilebilir.
Alanları yalnızca geçerli isabetle göndermek için send yöntemine bağımsız değişkenler olarak aktarabilirsiniz. Alan verilerinin takip eden tüm isabetlerle gönderilmesi için set yöntemini kullanarak izleyiciyi güncellemeniz gerekir.
Gönderme yöntemi
İzleyicinin send yöntemi, doğrudan İzleyici nesnesinin kendisinden veya ga() komut sırasına bir send komutu eklenerek çağrılabilir. Çoğu zaman izleyici nesnesine referans uygulamadığınız için ga() komut sırasını kullanarak izleyici verilerini Google Analytics'e gönderebilirsiniz.
ga() komut sırasını kullanma
ga() komut sırasına send komutu eklemenin imzası aşağıdaki gibidir:
ga('[trackerName.]send', [hitType], [...fields], [fieldsObject]);
Yukarıda belirtildiği gibi, hitType, ...fields ve fieldsObject parametreleriyle belirtilen değerler yalnızca geçerli isabet için gönderilir. Bunlar, izleyici nesnesinde saklanmaz ve sonraki isabetlerle gönderilmez.
send komutuyla iletilen alanlardan herhangi biri zaten izleyici nesnesinde ayarlanmışsa izleyicide depolanan değerler yerine komutta iletilen değerler kullanılır.
send komutuna yapılan çağrılar için hitType belirtilmelidir ve belirtilen türe bağlı olarak başka parametreler de gerekebilir. Daha fazla ayrıntı için sol taraftaki gezinme menüsünde yaygın kullanıcı etkileşimlerini ölçme ile ilgili yönergeleri inceleyin.
Tüm isabet türleriyle çalışan send komutunu kullanmanın en kolay yolu, fieldsObject parametresini kullanarak tüm alanları 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 olanak tanır. Örneğin, "event" isabet türünün yukarıdaki send komutu ş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 "parametreleri&bölümü bölümüne bakın.
Adlandırılmış izleyici kullanma
Varsayılan izleyici yerine adlandırılmış bir izleyici kullanıyorsanız adını komut dizesinde iletebilirsiniz.
İzleyicide "myTracker" adı verilen izleyicide şu send komutu çağrılacak:
ga('myTracker.send', 'event', 'Video', 'play', 'cats.mp4');
İzleyici nesnesinin kendisinde
İzleyici nesnesine başvurursanız bu izleyicinin send yöntemini doğrudan çağırabilirsiniz:
ga(function(tracker) {
tracker.send('event', 'Video', 'play', 'cats.mp4');
});
İsabetin ne zaman gönderildiğini öğrenme
Bazı durumlarda, isabetin ne zaman tamamlandığını Google Analytics'e göndermeyi bilmeniz gerekir. Böylece bu işlemi yaptıktan hemen sonra işlem yapabilirsiniz. Bu durum kullanıcıyı belirli bir sayfadan uzaklaştıracak belirli bir etkileşimi kaydetmeniz gerektiğinde yaygın olarak kullanılır. Çoğu tarayıcı, sayfa yüklenmeye başlar başlamaz JavaScript'i çalıştırmayı bırakır. Bu nedenle, isabet göndermek için analytics.js komutlarınız hiçbir zaman çalışmayabilir.
Buna örnek olarak, bir kullanıcının "gönder" düğmesini tıkladığını kaydetmek için etkinlik göndermek isteyebilirsiniz. Çoğu durumda, gönder düğmesini tıklamak sonraki sayfayı yüklemeye başlar ve ga('send', ...) komutları çalıştırılmaz.
Bu sorunun çözümü, sayfanın yüklenmesinin durdurulması için etkinliğe müdahale edilmesidir. Daha sonra isabetinizi her zamanki gibi Google Analytics'e gönderebilirsiniz. İsabet gönderildikten sonra formu programatik olarak yeniden gönderebilirsiniz.
hitCallback
Bir isabetin gönderilmesi tamamlandığında bilgilendirilmek için hitCallback alanını ayarlarsınız. hitCallback, isabet başarılı bir şekilde gönderildikten hemen sonra çağrılan bir işlevdir.
Aşağıdaki örnekte bir formun varsayılan gönderme işleminin iptal edilmesi, Google Analytics'e isabet gönderilmesi ve ardından hitCallback işlevi kullanılarak formun yeniden gönderilmesi 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 düzgün çalışsa da ciddi bir sorunu var. Analytics.js kitaplığının herhangi bir nedenle yüklenememesi durumunda hitCallback işlevi hiçbir zaman çalışmaz. hitCallback işlevi hiçbir zaman çalışmazsa kullanıcılar hiçbir zaman formu gönderemez.
Kritik site işlevini hitCallback işlevine eklediğinizde, analytics.js kitaplığının yüklenemediği durumları yönetmek için her zaman bir zaman aşımı işlevi kullanmanız gerekir.
Bir sonraki örnek, zaman aşımını kullanmak için yukarıdaki kodu günceller. Kullanıcı "gönder" düğmesini tıkladıktan sonra hitCallback saniye dolmazsa form yine de 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ı sitenizin birçok yerinde kullanıyorsanız zaman aşımlarını işlemek için bir yardımcı program işlevi oluşturmak muhtemelen daha kolay olacaktır.
Aşağıdaki yardımcı program işlevi, bir işlevi giriş 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 bağımsız olarak ç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önderilmediği veya analytics.js kitaplığının hiçbir zaman yüklenmediği durumlarda bile sitenizin beklendiği gibi çalıştığından emin olmak 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ı ulaşım mekanizmalarını belirtme
Analytics.js, varsayılan olarak isabetlerin en uygun şekilde gönderileceği HTTP yöntemini ve aktarım mekanizmasını seçer. Üç seçenek vardır: 'image' (Image nesnesi kullanarak), 'xhr' (XMLHttpRequest nesnesi kullanarak) veya 'beacon', yeni navigator.sendBeacon yöntemi kullanılır.
Önceki iki yöntem, önceki bölümde açıklanan sorunu paylaşır (burada, sayfa boşaltılıyorsa isabetlerin genellikle gönderilmediği durumlarda). Öte yandan 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 özelliğini destekliyorsa 'beacon' mekanizmasını transport mekanizması olarak belirtebilirsiniz. İsabet geri çağırmayı ayarlamakla ilgili endişelenmeniz gerekmez.
Aşağıdaki kod, taşıma mekanizmasını destekleyen tarayıcılarda 'beacon' olarak ayarlıdır.
ga('create', 'UA-XXXXX-Y', 'auto');
// Updates the tracker to use `navigator.sendBeacon` if available.
ga('set', 'transport', 'beacon');
Sonraki adımlar
Bazı kullanıcı etkileşimi türlerini ölçmek bazen karmaşık uygulamalar gerektirebilir. Ancak birçok durumda, bu uygulamalar halihazırda geliştirilip analytics.js eklentileri olarak kullanıma sunulmuştur. Bir sonraki kılavuzda, analytics.js eklentilerinin ga() komut sırası ile nasıl kullanılacağı açıklanmaktadır.