如何扩展谷歌分析以跟踪AJAX等(根据H5BP文档)

您尝试添加的代码不起作用,因为_gaq用于将跟踪信标推送到较旧的Google Analytics(GA)版本的数组也是如此.但HTML5 BoilerPlate(H5BP)在您最近使用的最新版本中已经更新,以利用Universal Analytics(UA),这是Google发布的下一个GA版本.这可以从协议相对URL //www.google-analytics.com/analytics.js以及最新版本的文档中看出.遗憾的是,您提到的文档似乎尚未更新,因为H5BP为优化GA代码的来源提供的链接本身已使用UA代码进行更新,而这正是H5BP源正在使用的内容.

因此,扩展_gaq对象使用的附加源代码将无法正常工作,因为您没有使用ga.js具有处理_gaq从GA 推送到对象的数据的函数,而是analytics.js用于UA,它不会初始化任何此类对象_gaq或具有用于处理推送到的数据的函数_gaq.

但是,在升级使用analytics.js(UA)之前,H5BP有一个GA版本的脚本,就像这样(我得到了这个,由一位曾经与H5BP合作的朋友提供):

<!-- Google Analytics: change UA-XXXXX-X to be your site's ID. -->
    <script>
        var _gaq=[['_setAccount','UA-XXXXX-X'],['_trackPageview']]; //here the _gaq was initialised
        (function(d,t){var g=d.createElement(t),s=d.getElementsByTagName(t)[0];
        g.src='//www.google-analytics.com/ga.js';
        s.parentNode.insertBefore(g,s)}(document,'script'));
    </script>

理想情况下,这应该取代您提到的代码行,即

(function(b,o,i,l,e,r){b.GoogleAnalyticsObject=l;b[l]||(b[l]=
    function(){(b[l].q=b[l].q||[]).push(arguments)});b[l].l=+new Date;
    e=o.createElement(i);r=o.getElementsByTagName(i)[0];
    e.src='//www.google-analytics.com/analytics.js';
    r.parentNode.insertBefore(e,r)}(window,document,'script','ga'));
    ga('create','UA-XXXXX-X');ga('send','pageview');

如果你这样做,那么你使用代码

if (typeof _gaq !== "undefined" && _gaq !== null) {
$(document).ajaxSend(function(event, xhr, settings){
    _gaq.push(['_trackPageview', settings.url]);
});
}

等等哪些用途_gaq都有效.

另外请记住,您目前正在使用的H5BP代码是最好的,因为Google正在逐步淘汰GA,以使Universal Analytics成为分析的未来.我提到的旧代码不再有效(或将在不久的将来停止工作,具体取决于Google).在UA升级中心了解更多相关信息.

请记住,当前的H5BP使用UA(analytics.js)代码,这是Google提供的优化形式,如此处所示.

这就解释了为什么上面提到的脚本extend.md不适用于您似乎正在使用的H5BP,这是一种可能的解决方法,通过实现旧代码.您需要的是使用您现有的脚本跟踪AJAX等的方法.为此,每次AJAX请求完成时,您只需记录虚拟页面浏览量即可.你可以在这里找到类似的场景.在那里,提问者将跟踪应用于模态的开头.您可以应用相同的技术来跟踪AJAX调用以及页面或部分页面的检索.在你的情况下,我在答案中指定的VURL可以是/virtual/ajax/url-of-page-retrieved-via-ajax.

如果您不希望发送虚拟综合浏览量,您还可以为每个AJAX请求发送自定义事件.了解更多有关事件追踪UA 这里.

如果您想知道您指定的函数的参数代表什么,您可以在这里阅读.这是extend.md您提到的文件中的脚本所在的位置.尝试修改脚本以便与UA一起使用可能如下所示:

(function ($) {
  // Log all jQuery AJAX requests to Google Analytics
  $(document).ajaxSend(function(event, xhr, settings){ 
    ga('send','pageview',settings.url.pathname);
  });
})(jQuery);

该ajaxSend()方法是一个回调,每次jQuery AJAX调用完成时都会触发该回调.记住jQuery这里的话.这仅适用于jQuery AJAX请求.xhr通常代表XMLHttpRequest.我认为它假设一个人知道jQuery AJAX调用是什么,我对此并不是很了解.

要使用UA跟踪Javascript错误,类似的脚本将是:

(function(window){
var undefined,
    link = function (href) {
        var a = window.document.createElement('a');
        a.href = href;
        return a;
    };
window.onerror = function (message, file, line, column) {
    var host = link(file).hostname;
    ga('send','event',
        (host == window.location.hostname || host == undefined || host == '' ? '' : 'external ') + 'error',
        message, file + ' LINE: ' + line + (column ? ' COLUMN: ' + column : ''),
        {'nonInteraction': 1});
    };
}(window));

这同样收集:事件类别将是host+error,Action将是错误消息,标签将指向错误发生的位置(行号,文件名等).

跟踪页面滚动也非常相似:

$(function(){
var isDuplicateScrollEvent,
    scrollTimeStart = new Date,
    $window = $(window),
    $document = $(document),
    scrollPercent;

$window.scroll(function() {
        scrollPercent = Math.round(100 * ($window.height() + $window.scrollTop())/$document.height());
        if (scrollPercent > 90 && !isDuplicateScrollEvent) { //page scrolled to 90%
//If you want to track for page scroll for some other percentage of scroll, you
//can edit the number 90, or write additional conditional ga('send',...) calls
//inside this block and vary the label accordingly, specifying the percentage
//of scroll.
            isDuplicateScrollEvent = 1;
            ga('send','event','scroll',
            'Window: ' + $window.height() + 'px; Document: ' + $document.height() + 'px; Time: ' + Math.round((new Date - scrollTimeStart )/1000,1) + 's',
            {'nonInteraction':1}
        );
        }
    });
});

这里,事件类别将是scroll,操作将是窗口,高度和文档,以及时间.如果您想将滚动视为交互式事件(这意味着如果您希望用户在滚动时被跟踪为非反弹用户),则可以删除该行{'nonInteraction':1}

希望有所帮助!:)

我的网站上有几个ajax调用.使用Google Analytics Universal

$.ajax({
    ...
    success: function (data) {
        ga('send','pageview','/virtual/....');
    },
    ...
});

/virtual/如果我想使用或不使用ajax调用来分隔日期,则使用make过滤更容易