Google Analytics的一些能力保举

Google 已经帮我们做好了接入之前必要做的全部工作，接下来就是我们的事变了。不外我们要做的也很简朴，只必要把下面这段剧本添加到应用的 index.html 里，就可以了：

<script>

(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*newDate();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');

</script>

此刻我们来看一下 Google Analytics 是如安在应用措施中初始化的。

起首建设一个应用措施的追踪器。在 app.component.ts 中执行以下两个步调：

声明一个名为 ga，范例为 any 的全局变量（在 Typescript 中必要拟定变量范例）；

将下面一行代码插手到 ngInInit() 中。

ga('create',<你的追踪 ID>,'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 的在线节制台中可以看到这些记录。

（编辑：湖南网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!