Google analytics &引用；“只需链接”；事件在“之后触发”；“历史变迁”；事件

谷歌标签管理器（GTM）有一个内置触发器，名为“justlinks”。在我的VueJS应用程序中，GTM使用Vue路由器在触发“Just Links”触发器之前触发“History Change”事件

（历史记录更改事件与页面查看事件无关）

因此，

Page Path

GTM数据层变量（本应为触发事件的路径）与

Click URL

GTM数据层变量的值相同，后者是

标记中的

href

值

例如：

• 用户处于

  /support

• 用户点击链接到

  /about

• Vue路由器更新浏览器历史记录
• 历史更改事件触发并更新Google Tag Manager数据层的所有内部值（包括位置和页面路径）
• “仅链接”事件触发，

  页面路径

  和

  单击URL

  值现在都是

  /about

我假设GTM/Google Analytics有某种类型的内置延迟策略，不会干扰主Javascript线程上运行的其他内容。因此，在GTM/Google Analytics触发“Just Links”触发事件之前，Vue路由器会更改路由（从而触发历史更改）

（奇怪的是，当您在GTM中使用内置的

Click-All Elements

时，事件以正确的顺序触发。）

是否有其他人遇到过这个问题并提出了任何类型的解决方案？可能有一种解决方案，只需使用

单击-所有元素

，但默认情况下不会使用

遍历DOM树，并为

单击URL

值去掉href，这意味着在

中提取嵌套元素上的href值不起作用。然而，

只是链接

可以做到这一点

---

谢谢

你可以看看。调整click标记的优先级，使其高于依赖于历史更改触发器的标记的优先级

你可以看看。调整click标记的优先级，使其高于依赖于历史更改触发器的标记的优先级

由于站点更新，我遇到了这个问题。我没有将所有“Just Links”切换到“all Elements”，也没有处理许多令人头痛的问题，而是创建了一个新变量来引用页面路径，而不是内置的“page path”变量。这个变量基本上存储了“gtm.linkClick”现在视为上一页路径的内容，因为历史记录发生了变化。我只是初级JS，所以我相信有更好的方法来编写代码，但它是有效的

第一步是创建一个新的自定义HTML标记（随意命名），设置为在所有页面和历史记录更改中触发。标记将首先尝试将当前页面路径存储到会话存储中，如果会话存储不可访问，则返回到cookie。我使用Simo Ahava创建的变量方法来设置cookies。在将页面路径写入存储器之前有2秒的延迟，这对于“Just Links”触发器触发并接收“correct”值来说是足够的时间，然后在下一个页面视图或历史记录更改中被覆盖。我给sessionStorage和cookie起了相同的名字“gtm.truepage”

自定义HTML标记

函数truePage（）{
试一试{
var page=document.location.pathname；
var存储=window.sessionStorage；
if（存储）{
setTimeout（函数（）{
存储设置项（“gtm.truepage”，第页）；
},2000);
}否则{
setTimeout（函数（）{
{{JS-setCookie}（“gtm.truepage”，第1800000页，“/”，window.location.hostname）；
},2000);
}
}捕获（e）{
}
}
truePage（）；

由于站点更新，我刚刚遇到了这个问题。我没有将所有“Just Links”切换到“all Elements”，也没有处理许多令人头痛的问题，而是创建了一个新变量来引用页面路径，而不是内置的“page path”变量。这个变量基本上存储了“gtm.linkClick”现在视为上一页路径的内容，因为历史记录发生了变化。我只是初级JS，所以我相信有更好的方法来编写代码，但它是有效的

第一步是创建一个新的自定义HTML标记（随意命名），设置为在所有页面和历史记录更改中触发。标记将首先尝试将当前页面路径存储到会话存储中，如果会话存储不可访问，则返回到cookie。我使用Simo Ahava创建的变量方法来设置cookies。在将页面路径写入存储器之前有2秒的延迟，这对于“Just Links”触发器触发并接收“correct”值来说是足够的时间，然后在下一个页面视图或历史记录更改中被覆盖。我给sessionStorage和cookie起了相同的名字“gtm.truepage”

自定义HTML标记

函数truePage（）{
试一试{
var page=document.location.pathname；
var存储=window.sessionStorage；
if（存储）{
setTimeout（函数（）{
存储设置项（“gtm.truepage”，第页）；
},2000);
}否则{
setTimeout（函数（）{
{{JS-setCookie}（“gtm.truepage”，第1800000页，“/”，window.location.hostname）；
},2000);
}
}捕获（e）{
}
}
truePage（）；

您可以向路由器添加after hook，以创建如下自定义路径变量：

router.afterEach((to) => {
  window.vuePath = to
}

然后在Google Tag Manager中创建一个新的用户定义变量，该变量的JavaScript变量类型为Vue Path。将全局变量路径设置为

window.vuePath

---

现在，您可以在触发器中使用Vue Path而不是Page Path来获得正确的页面路径。

您可以向路由器添加一个后钩子，以创建如下自定义路径变量：

router.afterEach((to) => {
  window.vuePath = to
}

然后在Google Tag Manager中创建一个新的用户定义变量，该变量的JavaScript变量类型为Vue Path。将全局变量路径设置为

window.vuePath

N