2011-12-16 17 views
5

Sto cambiando una sezione di un sito Web per utilizzare le funzioni AJAX di deep linking di jQuery Address. Sto usando URI come mysite.com/#!/page1/subpage/ e così via.Utilizzo di Google Analytics per tenere traccia delle richieste AJAX

Ho letto un bel po 'sul monitoraggio del traffico con la funzione _gaq.push(), ma mi chiedevo se era possibile farlo in un po' di moda più tradizionale ...

Ogni richiesta AJAX chiama una funzione PHP che crea una pagina e la restituisce in un wrapper <HTML>, che mi consente di definire facilmente titoli di pagina personalizzati e così via.

Se inserisco il codice di analisi in quella pagina, jQuery chiamerà quella pagina per attivarla per tracciare la visita?

risposta

15

Ebbene si può utilizzare di jQuery AJAX Eventi per ascoltare a livello globale per le richieste di AJAX e poi spingere un indice sulla matrice _gaq (questo mi sembra l'approccio più mantenibile):

$(document).on('ajaxComplete', function (event, request, settings) { 
    _gaq.push(['_trackPageview', settings.url]); 
}); 

Nota che .on() è nuovo in jQuery 1.7 ed è lo stesso di .bind() in questo caso.

Si noti inoltre che non ho testato il contenuto degli argomenti passati per eventi AJAX globali.

UPDATE

È inoltre possibile utilizzare $.globalEval() per analizzare gli script caricati in un corpo di risposta AJAX: http://api.jquery.com/jquery.globalEval/

success: function(data) { 

    var dom = $(data); 

    dom.filter('script').each(function(){ 
     $.globalEval(this.text || this.textContent || this.innerHTML || ''); 
    }); 

    $('#mydiv').html(dom.find('#something').html()); 

} 

Fonte: jQuery - script tags in the HTML are parsed out by jQuery and not executed

2

Io uso un sistema che comporta la richiesta l'html come testo normale, analizzando prima l'html per cambiare tutti i tag di script in div, staccare t hose divs, aggiungi la pagina, quindi esegui il looping dei div (che in realtà sono script) e aggiungi il loro contenuto ai tag di script o crea tag di script con src su quel div. È molto simile a come l'esempio del framework history.js lo fa.

$.get(urlToLoad).promise().done(function(html) { 
    var outHTML = html; 
    outHTML = outHTML.replace(/<script/ig, "<div class='iscript'").replace(/<\/script/ig, '</script'); 
    outHTML = $(outHTML); 
    var scripts = outHTML.filter('div.iscript').detach(); 
    $content.html(outHTML); 
    scripts.each(function() { 
     var $this = $(this), s = document.createElement("script"); 
     if ($this.attr('src') != "") { 
     s.src = $this.attr('src'); 
     } else { 
     s.nodeValue = $this.text(); 
     } 
     $content[0].appendChild(s); // jquery's append removes script tags 
    }); 
}).always(function() { 
    $contentclone.replaceWith($content); 
    $content.slideDown(); 
    $contentclone.remove(); 
}); 

utilizzando questo metodo, è possibile aggiungere lo script che esegue il tracciamento su ciascuna pagina. Personalmente preferisco farlo sulla pagina globale in un modo simile a quello suggerito da Jasper.

5

Le altre risposte sono obsolete (a partire dal 2013) - Google consiglia di utilizzare il loro nuovo Universal Analytics

È possibile tenere traccia di pagine viste in modo asincrono come questo:

ga('send', 'pageview', '/my-page'); 

See: https://developers.google.com/analytics/devguides/collection/analyticsjs/pages#overriding

+0

Cosa c'è di diverso? Puoi chiamare '_gaq.push (['_ trackPageview'])' ogni volta che vuoi ... – Jasper

+0

@ Jasper- Questo codice è più attuale – Yarin

Problemi correlati