google.tagmanager 在单页面中的实践

在上一篇文章中说了下基础的 tagmanager 怎么使用 入口在这里

下面是我遇到的一些问题，以及处理方法，可能有些有问题，或者处理的很复杂，若是你有更好的思路，能够在留言区一块儿讨论。

1、单应用页面怎么处理 PV（pageview）？

如今有不少优秀的框架能实现页面应用化，一次加载全部资源，根据路由变化，加载不一样页面，而不进行刷新，例如 AngularJS ,因为这类网站在页面跳转时，并不进行页面刷新，因此 GA（analytics.google）不会发送 PV 数据， 这时该怎么办呢，其实官方文档中给出了建议，连接点这儿，文档的大意是，你的网站，你固然知道何时须要发 PV 了，so，须要的时候就发给我吧

第一步，设置 page，ga('set', 'page', '/new-page');

第二步，发送 pv，ga('send', 'pageview');

搞定，超简单。

一、可是这里有一个问题，设置 page？什么是 page？

举个例子，例如你使用的是 angular，你的连接就会像这样：harvestmoon.cn/blog/#/abc、 harvestmoon.cn/blog/#/xyz，… page 为别为 abc、xyz；在我本身的实践中，我是将 page 设置为 blog/abc 和 blog/xyz 的，统计的数据也是正确的，多是伟大的谷歌为咱们作好了兼容。

二、这里还有一个问题，在逻辑代码中，我知道何时执行 设置 page、发送 pv,可是在 tagmanager 中怎么设置触发器呢？

这位观众，你很厉害哦，一下抓住了重点，接下来，咱们就讲讲在单应用页面中怎么使用 tagmanager。

2、单应用页面中使用 tagmanager

问题的关键就是：在咱们本地的代码中，咱们老是知道什么时候发生了路由切换，从而知道何时发送 pv，以 angular 为例，以下代码

$rootScope.$on('$routeChangeSuccess', function (event, current, previous) {
    ga('set', 'page', '/blog/abc');
	ga('send','pageview');
});
复制代码

因此咱们只须要在 tagmanager 中找到这样一个触发时机便可，在新建触发器（triggers）时，伟大的谷歌再次让我膜拜，我发现一个内置的触发器叫作【历史记录更改】，它的意思是只要是网址发送了变化，就会触发，简直就是为单应用定制的触发器。

知道何时触发，接下来，只须要搞定执行代码便可，然而代码早已经有了 ga('set', 'page', '/new-page'); ga('send','pageview');

3、是时候看看具体的操做了

一、咱们从代码（tags）开始，选择新建代码，依次：

选择产品-》Google Analysis；

选择代码类型-》Universal Analytsis；

配置代码-》跟踪ID 填入你的 Analysis.Google 的 ID，在管理下的媒体资源设置下能够找到，我这里填入的是 ga-property 是引用了本身设置的一个变量（变量在下面介绍）。

-》跟踪类型：网页浏览（就是平时所说的 pv）

​ -》字段名称填入 page，值填入本页面的 page 值（这里我有使用了一个自定义的变量 ga-page 值，后边讲解怎么设置）

触发条件-》新建一个触发器，历史记录更改；如图，还有一个【窗口已经加载】触发器，是由于页面第一次加载时，咱们须要发送 pv，【历史记录更改】在第一次加载时，是不会触发的。

二、变量的建立，

1）ga-property 变量，在左边栏选择变量（variables），选择新建

选择类型-》常理

配置变量-》填入你的跟踪 ID 便可

2）ga-page 值

主要说下自定义的 JavaScript，你须要建立一个匿名函数，返回你须要的值便可

拿 www.smartisan.com/t2/#/overvi… 这个网址作例，我这里返回的就是 t2/overview，你能够根据本身的须要返回任何值

4、 可能的问题

tagmanager 解决单页面 pv 的问题大体就如上，下面记录一些已知问题

一、发送的 pv 标题错误：因为触发条件为【历史记录更改】，会致使单页面标题还未改变，就已经发送了 pv，因此每每本次 pv 的标题仍是上个页面的。

目前我想到的解决方法比较傻，就是每次发送 pv 的代码（tags）都选择【自定义 javascript】，在代码了 setTimeout 延迟大概 200ms 而后发送 pv，这时候标题已经切换为新的了。可是这样有个问题，【自定义 javascript】每次触发都会忘页面的 body 后边加入一个想 标签，目前看来虽然没有什么大的伤害，但老是不够优雅。

个人我的网站