jQuery: haga clic en seguimiento con PHP

Question

Sí, LO sé sobre Google Analytics. Lo utilizamos para nuestras métricas generales del sitio, y sé que podemos rastrear enlaces individuales. Sin embargo, necesitábamos una solución de seguimiento de enlaces muy específicas y necesitamos que el seguimiento de los datos disponibles para nuestra aplicación web en tiempo real , así que escribí mi propia solución:

jQuery:

$.fn.track = function() { 
    var source, url, name, ref, $this; 
    $this = $(this); 
    if (window.location.search.substring(1) != '') { 
     source = window.location.pathname + "?" + window.location.search.substring(1); 
    } else { 
     source = window.location.pathname; 
    } 
    url = jQuery.URLEncode($this.attr('href')); 
    name = $this.attr('name'); 
    ref = jQuery.URLEncode(source); 
    $this.live('click', function (click) { 
     click.preventDefault(); 
     $.post('/lib/track.php', { 
     url: url, 
     name: name, 
     ref: ref 
     }, function() { window.location = $this.attr('href'); }); 
    }); 
    }; 

.. .utilizando el complemento jQuery URLEncode (http://www.digitalbart.com/jquery-and-urlencode/).

Ahora, este código funciona bien con mi back-end PHP y en mi máquina, pero no parece funcionar de manera confiable para todos los demás. A veces, los parámetros que se pasan a través de jQuery NO se pasan, lo que da como resultado un registro en la base de datos sin name, url o ref.

Por mi vida, no puedo entender por qué esto podría estar pasando; Sé que el $.post está activando, ya que hay registros en la base de datos (en PHP, también grabo la IP de la solicitud junto con la marca de tiempo), pero en muchos casos el script PHP está recibiendo variables en blanco $_POST de jQuery.

Lo he probado en vivo en cada navegador al que tengo acceso en mi lugar de trabajo, y todos ellos funcionan bien para mí; sin embargo, aproximadamente el 75% de todos los registros creados (no por mis computadoras) vienen en blanco (la mayoría usa los mismos navegadores que yo).

¿Por qué podría estar pasando esto?

Answer 1

Creo que, al final, mi problema terminó siendo que demoró mucho para que jQuery analizara la solicitud, y soy bastante firme en cuanto a no querer hacer que los enlaces sean "dependientes" de javascript (ya sea que no funcionarían sin él o que el usuario tendría que esperar a que la solicitud de seguimiento se complete antes de llegar a la página nueva).

Después de navegar por muchas otras soluciones en línea - los préstamos de unos y de haber sido inspirado por otros - yo llegamos a la solución de abajo en javascript orígenes:

if (document.getElementsByClassName === undefined) { // get elements by class name, adjusted for IE's incompetence 
    document.getElementsByClassName = function(className) { 
     var hasClassName, allElements, results, element; 

     hasClassName = new RegExp("(?:^|\\s)" + className + "(?:$|\\s)"); 
     allElements = document.getElementsByTagName("*"); 
     results = []; 

     for (var i = 0; (element = allElements[i]) !== null; i++) { 
      var elementClass = element.className; 
      if (elementClass && elementClass.indexOf(className) != -1 && hasClassName.test(elementClass)) { 
       results.push(element); 
      } 
     } 

     return results; 
    }; 
} 

function addTracker(obj, type, fn) { // adds a tracker to the page, like $('xxx').event 
    if (obj.addEventListener) { 
    obj.addEventListener(type, fn, false); 
    } else if (obj.addEventListener) { 
    obj['e' + type + fn] = fn; 
    obj[type + fn] = function() { 
     obj['e' + type + fn](window.event); 
    }; 
    obj.attachEvent('on' + type, obj[type + fn]); 
    } 
} 

function save_click(passed_object) { // this function records a click 
    var now, then, path, encoded, to, from, name, img; 

    now = new Date(); 
    path = '/lib/click.php'; 
    from = (window.decode) ? window.decodeURI(document.URL) : document.URL; 
    to = (window.decodeURI) ? window.decodeURI(passed_object.href) : passed_object.href; 
    name = (passed_object.name && passed_object.name != '') ? passed_object.name : '[No Name]'; 

    // timestamp the path! 
    path += '?timestamp=' + now.getTime(); 

    path += '&to=' + escape(to) + '&from=' + escape(from) + '&name=' + name; // compile the path with the recorded information 
    img = new Image(); 
    img.src = path; // when we call the image, we poll the php page; genius! 

    while (now.getTime() < then) { 
    now = new Date(); // resets the timer for subsequent clicks 
    } 
} 

function get_targeted_links(target) { // finds targeted elements and wires them up with an event handler 
    var links, link; 
    if (document.getElementsByClassName) { 
    links = document.getElementsByClassName(target); 
    for (var i = 0; i < links.length; i++) { 
     link = links[i]; 
     if (link.href) { 
     addTracker(links[i], 'mousedown', save_click(links[i])); 
     } 
    } 
    } 
} 

addTracker(window, 'load', get_targeted_links('trackit')); 

... que parece ser mucho más ágil que el El plugin jQuery que escribí arriba, y hasta ahora ha sido lo suficientemente rápido como para rastrear todas las solicitudes que he lanzado.

¡Espero que ayude a alguien más!

Answer 2

Estos "clics" pueden provenir de bots o de alguien con JS desactivado. Si los enlaces a los que se hizo clic se deben rastrear, ¿por qué no se consideran enlaces solo JS, es decir. poner URL en un atributo diferente distinto de href, luego usar su manejador de clic para procesarlo, agregar verificación de referencia en su track.php

¿Ha marcado también si todos los elementos son enlaces?

Answer 3

Tal vez esto le ayudará a: http://www.digitalistic.com/2009/09/16/click-tracking-with-jquery/ mirada Tomados a éste también: http://think2loud.com/use-jquery-with-google-analytics-to-track-clicks-on-outgoing-links-from-your-site/