Question

我正在为我的网站使用HTML 5历史记录，因此，对于浏览器支持它的用户，点击链接不会重新加载整个页面，只会重新加载主要区域。

Google Analytics不会跟踪这些部分网页加载。如何跟踪它，就像没有HTML 5历史记录支持的用户一样？

Answer 1

每次加载新内容时，只需再次调用_trackPageview函数即可注册其他综合浏览量。这称为“虚拟网页浏览”，但在Google Analytics中以与真实网页浏览相同的方式注册。要设置页面的路径，您需要在函数中添加一个附加参数：

        _gaq.push(['_setAccount', 'UA-XXXXXXX-X']);
        _gaq.push(['_trackPageview', '/new/content']);

Answer 2

这是最新的通用跟踪代码。

最近，我不得不重新审视自己对新项目的回答。我注意到了一些我应该清理的问题。

要以编程方式发送网页浏览，您只想发送路径和查询，例如。对于http://example.com/path/to/resource?param=1，我们会发送/path/to/resource?param=1。

某些SPA使用HashBang（#!）作为其网址。所以我们需要在Hashbang之后发送任何东西。例如http://example.com#!path/to/resource我们会发送/path/to/resource?param=1。

我的解决方案的早期版本是错误的，并且对于在网址中有哈希的所有网址都会失败。另外，当我使用jQuery + History.js插件时，我的解决方案就是从那里听statechange。

使用此新代码发送综合浏览量。它更具弹性，适合混乱和历史。

    var loc = window.location,
        hashbang = "#!",
        bangIndex = location.href.indexOf(hashbang),
        page = bangIndex != -1 ? loc.href.substring(bangIndex).replace(hashbang, "/") : loc.pathname + loc.search;

    ga('send', 'pageview', page);

如果您没有专门使用Hashbang，只需更改hashbang = "#!",以匹配例如hashbang = "#@",

第二部分是检测网址何时发生变化。为此，您需要从您使用的任何库的文档中找到。

对于jQuery + History.js插件，下面的代码可以使用

$(window).on('statechange', function() {
    //put code here
});

可在https://developers.google.com/analytics/devguides/collection/analyticsjs/single-page-applications

找到更多信息

<击>

$(window).on('statechange', function() {
    var loc = window.location,
    page = loc.hash ? loc.hash.substring(1) : loc.pathname + loc.search;
    ga('send', 'pageview', page);
});

<击>

Answer 3

正如Ewan已经说过的那样，您应该在window.popstate事件中将分页视图发送到分析。所以，在普通的javascript中，如果你打电话：

history.pushState({'statedata':''}, 'title', '/new/page/url');

你应该简单地添加：

window.addEventListener('popstate', function(event) {
    ga('send', 'pageview');
});

实际上，新的通用跟踪代码会自动获取当前网址，因此您并不需要传递额外的参数。

如何在HTML 5历史记录中使用谷歌分析？

3 个答案: