如何扩展谷歌分析以跟踪AJAX等（根据H5BP文档）
我正在尝试安装extend.md文件中标识的google analytics augments程序（ https://github.com/h5bp/html5-boilerplate/blob/v4.3.0/doc/extend.md ）
它声明“优化的”谷歌分析JS片段包括以下代码：
var _gaq = [['_setAccount', 'UA-XXXXX-X'], ['_trackPageview']];
并且在定义_gaq之后，应添加其他增强function，例如track jquery AJAX requests ， track javascript errors和track page scroll 。
实际上，当前版本的H5BP中包含的片段并未将_gaq作为变量引用：
(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');
尝试使用任何H5BP扩展时，这会产生未定义的错误。 例如
if (typeof _gaq !== "undefined" && _gaq !== null) { $(document).ajaxSend(function(event, xhr, settings){ _gaq.push(['_trackPageview', settings.url]); }); }
因为没有定义_gaq，所以无法正常工作。
这些增益是如何实现的？ 有人可以提供一个显示所有扩展的完整实现的工作示例吗？
谢谢
您尝试添加的代码无法使用，因为_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 ，它具有处理从GA推送到_gaq对象的数据的function，但是用于UA的analytics.js ，不初始化任何此类对象如_gaq或具有处理推送到_gaq的数据的函数。
但是，在升级自己使用analytics.js （UA）之前，H5BP有一个GA版本的脚本，就像这样（我得到了这个，由一位曾经使用过H5BP的朋友提供）：
理想情况下，这应该取代您提到的代码行，即
(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提供的优化forms，如此处所示 。
这就解释了为什么extend.md提到的脚本extend.md用于您似乎正在处理的H5BP，这是一种可能的解决方法，通过实现旧代码。 您需要的是使用您现有的脚本跟踪AJAX等的方法。 为此，每次AJAX请求完成时，您只需记录虚拟页面浏览量即可。 你可以在这里找到类似的场景。 在那里，提问者将跟踪应用于模态的开头。 您可以应用相同的技术来跟踪AJAX调用以及页面或部分页面的检索。 我在答案中指定的VURL可以是/virtual/ajax/url-of-page-retrieved-via-ajax 。
如果您不希望发送虚拟综合浏览量，您还可以为每个AJAX请求发送自定义事件。 在此处阅读有关UA中事件跟踪的更多信息
如果您想知道您指定的函数的参数代表什么，可以在这里阅读。 这是您提到的extend.md文件中的脚本所在的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 ，操作将是错误消息，标签将指向错误发生的位置（行号，文件名等）。
跟踪页面滚动也非常相似：
$(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/....'); }, ... });
如果我想使用或不使用ajax调用来分隔日期，则使用/virtual/使过滤更容易