Состояние гонки и синхронное использование Google Analytics (_gaq)

Question

У меня есть веб-сайт, который использует более новый метод асинхронного отслеживания Google Analytics (_gaq). Проблема, с которой я столкнулся, заключается в том, что я хочу установить какое-то конкретное отслеживание ссылок и беспокоюсь, что буду создавать условия гонки.

По сути, это новостной сайт, поэтому в нем есть заголовки, которые ссылаются на истории повсюду. Заголовок для истории может появляться в 3 разных местах на странице и появляться на сотнях других страниц. Таким образом, чтобы понять, как наша аудитория взаимодействует с сайтом, мы должны отслеживать, как используется каждый конкретный блок заголовка, а не только пункт назначения. Из-за этих двух условий отслеживания отдельных страниц, а также отслеживания ссылочных страниц недостаточно, мы должны отслеживать отдельные ссылки.

Так что, если у меня есть ссылка.

<a href="http://www.blah.com" onclick="_gaq.push('_trackEvent','stuff')">Here</a>

Поскольку _gaq.push () - это асинхронный вызов, разве не возможно, что изменение страницы произойдет до того, как Google завершит отслеживание кликов? Если да, есть ли способ предотвратить это, или у меня возникло недопонимание о том, как работает Google Analytics Async (http://code.google.com/apis/analytics/docs/tracking/asyncUsageGuide.html).

Answer 1

Ты прав.Если браузер покидает страницу до того, как отправит маяк отслеживания GA (GIF-хит) для события, событие не будет записано.Однако это не ново для асинхронного кода, поскольку процесс отправки маяка отслеживания является асинхронным;старый код работал так же в этом отношении.Если отслеживание действительно так важно, вы можете сделать что-то вроде этого:

function track(link) {
  if (!_gat) return true;
  _gaq.push(['_trackEvent', 'stuff']);
  setTimeout(function() {location.href=link.href'}, 200);
  return false;
}

...

<a href="example.com" onclick="return track(this);"></a>

Это остановит браузер от перехода на следующую страницу при нажатии ссылки, если GA уже загружен (вероятно, лучшене заставлять пользователя ждать так долго).Затем он отправляет событие и ждет 200 миллисекунд, чтобы отправить пользователя на ссылку, по которой он щелкнул.Это увеличивает вероятность того, что событие будет записано.Вы можете увеличить вероятность еще больше, увеличив тайм-аут, но это также может повредить пользовательскому опыту в этом процессе.Это баланс, с которым вам придется экспериментировать.

Answer 2

У меня тоже есть эта проблема, и я полон решимости найти реальное решение.

А как насчет того, чтобы поместить функцию в очередь?

Answer 3

С Документация Google для универсальной аналитики (новая версия, поскольку большинство других ответов на этот вопрос). Теперь вы можете легко указать обратный вызов.

var trackOutboundLink = function(url) {
   ga('send', 'event', 'outbound', 'click', url, {'hitCallback':
     function () {
     document.location = url;
     }
   });
}

Для ясности я бы порекомендовал использовать этот синтаксис, чтобы было понятнее, какие свойства вы отправляете, и легче добавлять больше:

            ga('send', 'event', {
                'eventCategory': 'Homepage',
                'eventAction': 'Video Play',
                'eventLabel': label,
                'eventValue': null,

                'hitCallback': function()
                {
                    // redirect here
                },

                'transport': 'beacon',

                'nonInteraction': (interactive || true ? 0 : 1)
            });

[Вот полный список параметров для всех возможных ga вызовов.]

Кроме того, я добавил для параметра transport значение beacon (на самом деле не нужно, потому что он автоматически устанавливается при необходимости):

Указывает транспортный механизм, с помощью которого будут отправляться попадания. Возможные варианты: «маяк», «xhr» или «изображение». По умолчанию analytics.js постараюсь выяснить лучший метод на основе размера попадания и возможности браузера. Если вы укажете «маяк» и браузер пользователя не поддерживает метод navigator.sendBeacon, он отступит на «изображение» или «xhr» в зависимости от размера удара.

Таким образом, при использовании navigator.beacon навигация не прерывает отслеживание. К сожалению, поддержка Microsoft для маяка отсутствует , поэтому вам все равно следует включить перенаправление в обратный вызов.

Answer 4

В обработчике событий вы должны установить обратный вызов нажатия:

_gaq.push(['_set', 'hitCallback', function(){
  document.location = ...
}]);

отправить вам данные

_gaq.push(['_trackEvent'

и остановить обработку события

e.preventDefault();
e.stopPropagation();

Answer 5

Я пробую новый подход, в котором мы сами создаем URL для utm.gif и запрашиваем его, а затем только после получения ответа (gif) мы отправляем пользователя на его пути:

Использование:

  trackPageview(url, function() { document.location = url; });

код (CrumbleCookie от: http://www.dannytalk.com/read-google-analytics-cookie-script/)

/** 
 * Use this to log a pageview to google and make sure it gets through
 * See: http://www.google.com/support/forum/p/Google%20Analytics/thread?tid=5f11a529100f1d47&hl=en 
 */
function trackPageview(url, fn) {
  var utmaCookie = crumbleCookie('__utma');
  var utmzCookie = crumbleCookie('__utmz');

  var cookies = '__utma=' + utmaCookie + ';__utmz=' + utmzCookie;

  var requestId = '' + (Math.floor((9999999999-999999999)*Math.random()) + 1000000000);
  var hId = '' + (Math.floor((9999999999-999999999)*Math.random()) + 1000000000);

  var utmUrl = 'http://www.google-analytics.com/__utm.gif';
  utmUrl += '?utmwv=4.8.9';
  utmUrl += '&utmn=' + requestId;
  utmUrl += '&utmhn=' + encodeURIComponent(window.location.hostname);
  utmUrl += '&utmhid=' + hId;
  utmUrl += '&utmr=-';
  utmUrl += '&utmp=' + encodeURIComponent(url);
  utmUrl += '&utmac=' + encodeURIComponent(_gaProfileId); 
  utmUrl += '&utmcc=' + encodeURIComponent(cookies);

  var image = new Image();
  image.onload = function() { fn(); };
  image.src = utmUrl;
}

/**
 *  @author:    Danny Ng (http://www.dannytalk.com/read-google-analytics-cookie-script/)
 *  @modified:  19/08/10
 *  @notes:     Free to use and distribute without altering this comment. Would appreciate a link back :)
 */

// Strip leading and trailing white-space
String.prototype.trim = function() { return this.replace(/^\s*|\s*$/g, ''); }

// Check if string is empty
String.prototype.empty = function() {
    if (this.length == 0)
        return true;
    else if (this.length > 0)
        return /^\s*$/.test(this);
}

// Breaks cookie into an object of keypair cookie values
function crumbleCookie(c)
{
    var cookie_array = document.cookie.split(';');
    var keyvaluepair = {};
    for (var cookie = 0; cookie < cookie_array.length; cookie++)
        {
        var key = cookie_array[cookie].substring(0, cookie_array[cookie].indexOf('=')).trim();
        var value = cookie_array[cookie].substring(cookie_array[cookie].indexOf('=')+1, cookie_array[cookie].length).trim();
        keyvaluepair[key] = value;
    }

    if (c)
        return keyvaluepair[c] ? keyvaluepair[c] : null;

    return keyvaluepair;
}

Answer 6

Использование onmousedown вместо onclick также может помочь.Это не устраняет условия гонки, но дает GA преимущество.Есть также беспокойство, что кто-то щелкает ссылку и тянет ее, прежде чем отпустить кнопку мыши, но это, вероятно, незначительный случай.