Google跟踪代码管理器 - 让ID动态化

Question

我需要在我的应用程序中实现google标记管理器。它是一个具有单独配置系统的多租户应用程序。

我已经设置了谷歌标签管理器和分析。我正在我的正文页面下面添加以下代码片段： -

<!-- Google Tag Manager -->
<noscript>
    <iframe src="//www.googletagmanager.com/ns.html?id=GTM-XXXX"
            height="0" width="0" style="display:none;visibility:hidden"></iframe>
</noscript>
<script>
(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'//www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window, document, 'script', 'dataLayer', 'GTM-XXXX');</script>
<!-- End Google Tag Manager -->

但是我需要根据加载的站点动态指定id（'GTM-XXXX'）。有没有办法在运行时/动态上提到上面的代码片段中的id？我需要在iframe和脚本中替换/更改id。

还要注意它的一个angularJS前端

Answer 1

iframe和脚本是互斥的;一个将在用户启用Javascript时发生（基本上一直都是），而另一个则不会发生（在这种情况下，Google跟踪代码管理器会尽力而为，但可能无法跟踪这一切。您可以单独构建解决方案。

您只需编写一个小函数，根据一些可识别的变量，决定部署哪个GTM代码，并分别替换该代码段或iframe src。

Answer 2

嗯，我可能在这里错了，但你可以为你当前的页面存储一个全局变量（即window.pageGTM = GTM-XXXXX），然后将该变量放在容器片段中。