Отслеживание пикселей с помощью JavaScript

Question

У меня есть пиксель отслеживания, который мне нужно загрузить в JS, одним нажатием кнопки. Итак, процесс выглядит следующим образом:

1. Пользователь нажимает на ссылку
2. Я предотвращаю щелчок (e.preventDefault)
3. загрузить пиксель отслеживания
4. Перенаправить пользователя

Вот код:

$('.btn-cta').on('click', function (e) {
   e.preventDefault();
   $('body').append('<img width="1" height="1" src="http://main.exoclick.com/tag.php?goal=xyz">');
   window.location.replace($(this).attr('href'));
});

Моя проблема в том, что не 100% людей, которые нажимают, отслеживаются, кажется, что около 40/50% из них не отслеживаются. Я не вижу другого способа сделать это, у вас есть идея лучше отслеживать подобные вещи в JS?

Все идеи приветствуются.

Джон

Answer 1

Подождите, пока изображение загрузится, затем перенаправьте.

$('.btn-cta').on('click', function (e) {
   e.preventDefault();

    var url = $(this).attr('href');
    var track = new Image();
    track.onload = function(){
        window.location.replace( url );
    };
    // in case the tracking server is down or misconfigured (see comments)
    // otherwise the navigation would be broken.
    track.onerror = function(){
        window.location.replace( url );
    };
    track.src = 'http://main.exoclick.com/tag.php?goal=xyz';
});