gtag / google_tag_manager混淆
gtag / google_tag_manager混淆
提问于 2019-10-11 05:46:59
我正在使用Google Analytics来跟踪我的react应用程序中的自定义事件。当我第一次推出代码时，我阅读了this document，建议使用gtag方法而不是ga方法来进行日志记录调用。这一直运行得很好。
我使用的是Google Tag Manager，所以这些脚本都是通过GTM加载的(可能)。
现在我正在做一些更棘手的事情，服务器需要告诉客户端在特定情况下登录页面加载。因此，我对GTM初始化代码进行了修改，以便在GTM加载后触发事件。我读过如何做到这一点的here。
奇怪的是，当指示GTM库已经加载的回调触发时，gtag没有被定义，并且在Analytics中记录事件的代码失败。当我可以在浏览器控制台中输入gtag时，它已经定义好了，所以也许GTM脚本正在二次加载它？
if (!!window.google_tag_manager) {
// Google Tag Manager has already been loaded
doSomethingWith(window.google_tag_manager);
} else {
window.addEventListener('gtm_loaded', function() {
//----------------------------------------
// Google Tag Manager has been loaded, but
// gtag object is not defined :(
//----------------------------------------
});
}是否有其他方法可以使用google_tag_manager对象记录分析事件？或者，有没有办法知道gtag对象在轮询之外什么时候可用(真的想避免这种情况)？
这是我用来加载GTM的代码
class InitDataLayer extends Component {
componentDidMount = () => {
window.dataLayer = [{
appName: 'promos',
}];
}
render = () => (<script id="init-data-layer" />)
}
class LoadGtm extends Component {
componentDidMount = () => {
(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='https://www.googletagmanager.com/gtm.js?id='+i+dl;
f.parentNode.insertBefore(j,f);
j.addEventListener('load', () => {
const _ge = new CustomEvent('gtm_loaded', { bubbles: true });
d.dispatchEvent(_ge);
});
})(window,document,'script','dataLayer','GTM-XXXXXXX');
}
render = () => (<script id="load-gtm" />)
}回答 2
Stack Overflow用户
发布于 2019-10-11 18:37:54
您可以在google标签管理器界面中创建google分析事件。这不需要额外的编码。请参阅参考https://support.google.com/tagmanager/answer/6107124?hl=en
Stack Overflow用户
发布于 2019-10-11 21:57:32
我意识到gtag是在GTM中定义的！然后，我用我的问题中概述的方法修改了标记，以触发一个自定义事件，指示gtag何时可用：
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-XXXXXXXXXX"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-XXXXXXXXXX', {send_page_view: false});
var _ge = new CustomEvent('gtag_loaded', { bubbles: true });
document.dispatchEvent(_ge);
</script>现在在客户端代码中
if(typeof gtag !== 'undefined') {
gaSendEvent(event);
} else {
window.addEventListener('gtag_loaded', () => {
gaSendEvent(event);
});
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/58331519
复制相关文章
相似问题
腾讯云开发者
