有角度 – GTM在单页应用程序中随机跳过初始页面浏览

前端之家收集整理的这篇文章主要介绍了有角度 – GTM在单页应用程序中随机跳过初始页面浏览前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我在Google跟踪代码管理器中具有跟踪SPA浏览量的浏览量标签,与 this guide中描述的浏览量相同。基本上是通用Analytics(分析)与历史记录更改触发的链接的Google Analytics(分析)ID(某些时候,所有页面的触发器也没有成功添加)。

在我当前的应用程序中,GTM会在没有异步解析器的所有路由上跳过首页浏览量的Pageview标签。通常,路由有时会触发标签(1次5次),这可能会根据条件(缓存vs未缓存,localhost与生产)有所不同。

在具有长持续时间(> 1s)解析器的路线上,始终在初次浏览量上触发浏览量标签(5次5次)。

应用初始化(pushState)后,所有路线上的普通浏览标签都会正常触发。

此行为已通过GTM调试控制台和GA实时监控确认。

安装程序似乎是推荐的,GTM snippet加载到< head>中,Angular 2应用程序加载在< body>的末尾。

<html>
  <head>
    <script>/* Google Tag Manager snippet */</script>
    ...
  </head>

  <body my-app>
    ...
    <script src="my-app-bundle.js"></script>
  </body>
</html>

而角度2像往常一样被引导:

platformBrowserDynamic().bootstrapModule(MyAppModule);

我试图在我的app-bundle.js之前和之后移动GTM代码段,甚至用同步替换它:

<script>
  window.dataLayer = ...
</script>
<script src="https://www.googletagmanager.com/gtm.js?id=..."></script>

与默认代码片段没有任何区别。

我发现尝试和错误的浏览开始正常工作在初始页面浏览,如果应用程序引导相当大的延迟,200-1000毫秒(首先,DOMContentLoaded做的伎俩,但延迟是不够的):

setTimeout(() => {
  platformBrowserDynamic().bootstrapModule(MyAppModule);
},1000);

我希望这个问题对于使用SPA / Angular 2应用程序完成GTM的专家来说很熟悉。不幸的是,我无法为这种情况提供MCVE,但我相信可以使用带有路由和Google跟踪代码管理器帐户的任何Angular 2(2.3.1)应用程序进行复制。

通常Angular 2应用可以安全地引导到< body>的末尾。

在那里发生了什么,如何在没有竞争条件的情况下使用GTM正确处理页面浏览跟踪?

更新:从GTM切换到直接使用GA

router.events.subscribe(e => {
  if (e instanceof NavigationEnd)
    ga('send','pageview',location.pathname);
})

一切都可以在初始和后续的网页浏览时都没有竞争条件。

更新2:

在长时间运行的路由解析器成功的情况下,这是一个时间表,gtm.js和main.bundle.js在开始时被加载(这并不重要),analytics.js(analytics_debug)。当路由解析器完成并且浏览标签被触发时,即〜10秒后,加载GA调试器的js)

看起来分析脚本加载了< script async = true&gt ;:: j.async = true;或a.async = 1; 尝试删除异步,看看它是否有帮助。

猜你在找的Angularjs相关文章