Autotrack for analytics.js 简介

truthrudy

发布者：Philip Walton，开发者计划工程师

英文原文：Introducing Autotrack for analytics.js

自从 Google Analytics 问世以来，Web 已经发生了很大改变。在当时，大多数网站实际是由单独的页面组成，通过点击链接并发出整页请求从一个页面转到另一个页面。对于这样的网站，一个通用的 JavaScript 跟踪代码段就可以跟踪到大部分相关的用户交互。

但如今的 Web 比以前要复杂多样。除了传统的静态网站，还有功能全面的 Web 应用。用户交互不限于点击链接和提交表单，而“页面查看”并不总是意味着整个页面加载。

Web 已经改变，但分析的实现方法基本还停留在原地。大多数 Google Analytics 用户只是复制粘贴默认的跟踪代码段，仅此而已。他们知道还可以用 Google Analytics 做更多事情，但往往不重视进行学习。

Autotrack for analytics.js 为这一问题提供了新解决方案。它试图在利用尽可能多的 Google Analytics 的同时尽量避免手动实现。它为开发人员提供了跟踪现代化 Web 相关用户数据的基础。

功能

Autotrack 库被设计成 analytics.js 插件的集合，从而便于原样利用整个库，或是挑选使用您所需的插件。下面几节将描述 Autotrack 可以实现的一些功能。

出站链接和表单跟踪

当用户点击指向网站上另一页面的链接时，一旦用户转到该页面后，该页面通常会发送一次页面查看匹配。因为会有一系列页面查看， Google Analytics 可在后端计算出用户导航目标（和源）。但如果用户点击的链接或提交的表单指向外部域，该操作不会被捕捉，除非您明确告诉 Google Analytics 发生了什么。

在过去，出站链接和表单跟踪很难实现，因为一旦新页面开始加载，浏览器就会停止执行当前页面上的 JavaScript。Autotrack 替您解决了这些难题，因此您可以免费实现出站链接和表单跟踪。

单页面应用的 URL 变化跟踪

如果您正在构建一个单页面应用，它使用 History API 动态加载内容并更新 URL，那么默认的跟踪代码段是不够的 — 它只能跟踪初始页面加载。即使您在成功加载新内容后发送额外的页面查看，但可能还有难题。

Autotrack 可以自动检测 History API 发出的 URL 变化并将其作为页面查看进行跟踪。它还能保持跟踪程序与更新后的 URL 同步，从而使后续所有匹配（事件、社交互动等） 都与正确的 URL 相对应。

声明性事件跟踪

有时候，以声明方式将事件添加到 HTML 要比在 JavaScript 中手动编写事件侦听器更简单。跟踪简单的点击事件就是一个典型的例子。要使用 Autotrack 跟踪点击事件，您只需将数据属性添加到标记中。

当用户点击以上按钮时，相应类别和操作（标签和值可选）的事件被发送到 Google Analytics。

<button data-event-category="Video" data-event-action="play">Play</button>

媒体查询跟踪

目前的大多数网站使用响应式设计，根据用户设备的屏幕大小或功能更新页面布局。如果使用媒体查询来改变页面外观或功能，那么捕捉上述信息以更好地了解当激活不同的媒体查询时，用法有何不同就非常重要。

Autotrack 可以让您注册所用的媒体查询值集合，而这些值是通过自定义维度自动跟踪的。它还会跟踪那些值何时变化。（请注意，媒体查询跟踪需要您在 Google Analytics 中设置自定义维度。该过程只需几分钟，其使用方法在 mediaQueryTracker 插件文档中有介绍。）

这些只是您使用 Autotrack 后可以启用的几个功能。关于所有插件列表及其使用方法，请参阅 Github 上的 Autotrack 文档。

谁应该使用 Autotrack？

尽管任何人都可以使用 Autotrack 并从中受益，但该库主要针对那些未定制其当前的分析实现，并想利用本文所述功能的网站。

如果您只使用目前的默认跟踪代码段，您应该考虑使用 Autotrack。如果您已经有了 Google Analytics 的自定义实现，应先查看文档，以确保 Autotrack 的任何功能不会发生冲突，数据不会被重复计算。

后续步骤

要开始使用 Autotrack，请查看文档的用法章节。如果您想看一看 Autotrack 捕获的数据是什么样，Google Analytics 演示与工具网站使用了 Autotrack 并有一张图表显示该网站自身的 Google Analytics 数据。

如果您想更深入了解，那么 Autotrack 库是开源的，可以作为很好的学习资源。通读插件源代码，更好地了解有多少 analytics.js 高级功能可用。

最后，如有反馈或建议，请联系我们。您可以在 Github 上报告错误或提交任何问题。