Google Analytics:如何在单页应用中跟踪网页？

Question

目前在我的网站上,我使用HTML5 pushState()和popState链接来提高速度.但是,这并没有真正改变真实的网址,看起来它会影响并搞乱谷歌分析的代码.(不显示网址更改)是否有可能的解决方案？谢谢,

Answer 1

如果您使用的是较新的analytics.jsAPI,Google的文档需要使用以下代码来触发事件:

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

如果您使用的是较旧的ga.jsAPI,David Walsh建议 AJAX网站使用该_gaq.push方法:

_gaq.push(['_trackPageview', '/some-page']);

Answer 2

我知道这是一个老问题,但由于这个问题首先导致Google在Google Analytics中跟踪pushState()并且所有答案都错了,我决定回答它.

在其他答案中,他们提到直接使用ga('发送'.....),但这是错误的方法.

首先,您必须"设置"参数,然后使用"发送"来跟踪它.

如果您只想更新网址,请使用以下代码

// set new url 
ga('set', 'page', '/new-page');

// send it for tracking
ga('send', 'pageview');

如果要更新网址和标题,请为其添加title参数

// set new url and title
ga('set', {
  page: '/new-page',
  title: 'New Page'
});

// send it for tracking
ga('send', 'pageview');

源单页应用程序跟踪 - Web跟踪(analytics.js)

Answer 3

最近的回答(2017)

您现在可以使用Google的autotrack.js一个增强的脚本analytics.js.

它包含一个插件,可自动跟踪单页应用程序的URL更改.

您只需要在html中包含脚本和以下行:

ga('require', 'urlChangeTracker');

Answer 4

2020年更新

如果您正在使用，如果您在“数据流”菜单的“增强型测量”功能中启用了“页面浏览量”Google Analytics 4选项，则无需再推送事件。

Answer 5

2018年2月更新-全球站点标签（gtag.js）

Google Analytics（分析）有一个新的跟踪代码段，因此其他答案可能不适用于gtag。

这是默认的跟踪代码。即使我们尝试运行每个URL更改，它也只能运行一次。

gtag('config', 'GA_TRACKING_ID');

但有了一个page_path参数，我们可以使GA手动运行。

gtag('config', 'GA_TRACKING_ID', {'page_path': '/new-page.html'});

我们可以做这样的事情。

var origin = window.location.protocol + '//' + window.location.host;
var pathname = window.location.href.substr(origin.length);
gtag('config', 'GA_TRACKING_ID', {'page_path': pathname});

使用gtag.js进行单页应用程序跟踪（Google文档）