如何使用Google Analytics？

准备好应用程序

首先需要有一个 追踪 ID(tracking ID)。在开始编写业务代码之前，要先准备好一个追踪 ID，通过这个唯一的标识，Google Analytics 才能识别出某个点击或者某个页面访问是来自于哪一个应用。

按照以下的步骤：

访问 https://analytics.google.com；

提交指定信息以完成注册，并确保可用于 Web 应用，因为我们要开发的正是一个 Web 应用；

同意相关的条款，生成一个追踪 ID；

保存好追踪 ID。

追踪 ID 拿到了，就可以开始编写业务代码了。

添加 analytics.js 脚本

Google 已经帮我们做好了接入之前需要做的所有事情，接下来就是我们的工作了。不过我们要做的也很简单，只需要把下面这段脚本添加到应用的 index.html 里，就可以了：

(function(i,s,o,g,r,a,m){i[‘GoogleAnalyticsObject’]=r;i[r]=i[r]||function(){

(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),

m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)

})(window,document,’script’,’https://www.google-analytics.com/analytics.js’,’ga’);

现在我们来看一下 Google Analytics 是如何在应用程序中初始化的。

创建追踪器

首先创建一个应用程序的追踪器。在 app.component.ts 中执行以下两个步骤：

声明一个名为 ga，类型为 any 的全局变量（在 Typescript 中需要制定变量类型）；

将下面一行代码加入到 ngInInit() 中。

ga(‘create’, , ‘auto’);

这样就已经成功地在应用程序中初始化了一个 Google Analytics 的追踪器了。由于追踪器的初始化是在 OnInit() 函数中执行的，因此每当应用程序启动，追踪器就会启动。

在单页应用中记录页面访问情况

我们需要实现的是记录 访问路由(route-visits)。

如何记录用户在一个应用中不同部分的访问，这是一个难点。从功能上来看，单页应用中的路由对应了传统多页面应用中各个页面之间的跳转，因此我们需要记录访问路由。要做到这一点尽管不算简单，但仍然是可以实现的。在 app.component.ts 的 ngOnInit() 函数中添加以下的代码片段：

import { Router, NavigationEnd } from ‘@angular/router’;

…

constructor(public router: Router) {}

…

this.router.events.subscribe(

event => {

if (event instanceof NavigationEnd) {

ga(‘set’, ‘page’, event.urlAfterRedirects);

ga(‘send’, { hitType: ‘pageview’, hitCallback: () => { this.pageViewSent = true; }});

}

}

);

神奇的是，只需要这么几行代码，就实现了 Angular 应用中记录页面访问情况的功能。

这段代码实际上做了以下几件事情：

从 Angular Router 中导入了 Router、NavigationEnd；

通过构造函数中将 Router 添加到组件中；

然后订阅 router 事件，也就是由 Angular Router 发出的所有事件；

只要产生了一个 NavigationEnd 事件实例，就将路由和目标作为一个页面访问进行记录。

这样，只要使用到了页面路由，就会向 Google Analytics 发送一条页面访问记录，在 Google Analytics 的在线控制台中可以看到这些记录。

类似地，我们可以用相同的方式来记录除了页面访问之外的活动，例如某个界面的查看次数或者时长等等。只要像上面的代码那样使用 hitCallBack() 就可以在有需要收集的数据的时候让应用程序作出反应，这里我们做的事情仅仅是把一个变量的值设为 true，但实际上 hitCallBack() 中可以执行任何代码。

追踪用户交互活动

除了页面访问记录之外，Google Analytics 还经常被用于追踪用户的交互活动，例如某个按钮的点击情况。“提交按钮被用户点击了多少次？”，“产品手册会被经常查阅吗？”这些都是 Web 应用程序的产品评审会议上的常见问题。这一节我们将会介绍如何实现这些数据的统计。

按钮点击

设想这样一种场景，需要统计到应用程序中某个按钮或链接被点击的次数，这是一个和注册之类的关键动作关系最密切的数据指标。下面我们来举一个例子：

假设应用程序中有一个“感兴趣”按钮，用于显示即将推出的活动，你希望通过统计这个按钮被点击的次数来推测有多少用户对此感兴趣。那么我们可以使用以下的代码来实现这个功能：

…

params = {

eventCategory:

‘Button’

,

eventAction:

‘Click’

,

eventLabel:

‘Show interest’

,

eventValue:

1

};

showInterest() {

ga(‘send’, ‘event’, this.params);

}

…

现在看下这段代码实际上做了什么。正如前面说到，当我们向 Google Analytics 发送数据的时候，Google Analytics 就会记录下来。因此我们可以向 send() 方法传递不同的参数，以区分不同的事件，例如两个不同按钮的点击记录。

1、首先我们定义了一个 params 对象，这个对象包含了以下几个字段：

eventCategory – 交互发生的对象，这里对应的是按钮（button）

eventAction – 发生的交互的类型，这里对应的是点击（click）

eventLabel – 交互动作的标识，这里对应的是这个按钮的内容，也就是“感兴趣”

eventValue – 与每个发生的事件实例相关联的值

由于这个例子中是要统计点击了“感兴趣”按钮的用户数，因此我们把 eventValue 的值定为 1。

2、对象构造完成之后，下一步就是将 params 对象作为请求负载发送到 Google Analytics，而这一步是通过事件绑定将 showInterest() 绑定在按钮上实现的。这也是使用 Google Analytics 追踪中最常用的发送事件方法。

至此，Google Analytics 就可以通过记录按钮的点击次数来统计感兴趣的用户数了。

相关推荐: 如何监测竞争对手站外推广活动及流量来源

监测竞争对手站外推广活动及流量来源 01 最简单的方式去Google搜索。一般格式是竞争对手品牌词+产品核心关键词+deals/coupons/giveaways/reivews等。 02 最好学会Google高级检索，网上有很多，自行查找一下。 03 去社交…