Have Geek Brain

Using new Image (). Src for click tracking

I am trying to understand why this clicker is not working. The code was written by another developer, so I'm not entirely sure if this ever worked.

function trackSponsor(o, p) {
        (new Image()).src = PATH_BASE + 'click/' + p + '/' + o + "?_cache=" + (+(new Date()));
    return false;
}

From what I can gather is that when this function is called, it creates a new image in order to run the php script asynchronously. According to Firebug, the request is made, however it "aborts" ~ 30ms. It's strange that it will "sometimes" work like 1 time in 10+ regardless of the browser.

I would rather fix this to make it work instead of rewriting it as an ajax request.

Any help is appreciated.

Thanks in advance.

EDIT

Due to the tvanfosson post that got me thinking. I've included a line that triggers click tracking below.

<a onclick="trackSponsor(60, 15077); goToNextStep(1988, 15077, 0); return false;" href="#">view</a>

goToNextStep () actually changes the page. I am under the impression that it will only be executed after trackSponsor () completes.

+2


a source to share


4 answers


It's actually pretty trivial to rewrite the get request with jQuery. The rewriting will certainly help the next developer understand what's going on and might solve your problem. I need to know more about the content of the variables - maybe they should be urlEncoded? - Before I can help you with this. You can try urlEncoding them and see what happens.

function trackSponsor(o, p) {
    var url = PATH_BASE + 'click/' + p + '/' + o + "?_cache=" + (+(new Date()));
    $.get(url); 
    return false; 
}


EDIT : You may need to check that another handler is not redirecting the browser to a new location when the tracking event is called. This will invalidate any pending requests on the page - and could allow multiple people to succeed based on request times and if results are delivered before the page is unloaded.

+1


a source


"(new image ()). src = url;" will just ask the browser to click on the URL. You must delay 50-100ms to make sure the tracking information has been sent to the server.



function delay(a) {
  for (var b = +new Date, c = 1; 0 < c; c++) {
    if (0 == c % 1E3) {
      var e = +new Date;
      if (b > e) break;
      if (e - b > a) break;
    }
  }
}
function trackSponsor(o, p) {
  (new Image()).src = PATH_BASE + 'click/' + p + '/' + o + "?_cache=" + (+(new Date()));
  delay(100);
  return false;
}
+1


a source


I poked around Google Analytics & rsquo; ga.js

which uses a method new Image()

similar to your script.

The only difference I could see was how the object is created. Google script assigns object to variable.

var d=new Image(1,1);d.src=f;

Could it be a shot?

function trackSponsor(o, p) {    
        var i = new Image(1,1);
        i.src = PATH_BASE + 'click/' + p + '/' + o + "?_cache=" + (+(new Date()));    
    return false;    
}

It shouldn't matter, but it's worth taking the picture.

0


a source


Maybe try this to avoid garbage collection so your log won't get lost.

var sendLog = (function () {
    var _unique = (function () {    /* 产生唯一标识*/
        var time = (new Date()).getTime() + '_',
            i = 0;

        return function () {
            return time + (i++);
        }
    }());

    var run = function (url) {
        var data = window['imgLogData'] || (window['imgLogData'] = {}),
            img = new Image(),
            uid = _unique();

        data[uid] = img;    /* 防止img被垃圾处理*/

        img.onload = img.onerror = function () {    /* 成功或失败后销毁对象*/
            img.onload = img.onerror = null;
            img = null;
            delete data[uid];
        };

        img.src = url + '&_cache=' + uid;   /* 发送统计内容*/
    };

    return run;
}());


sendLog('http://log_');
Run codeHide result


0


a source






More articles:


All Articles