gpt4 book ai didi

reactjs - Google Optimize 无法与 React App 配合使用(未设置 cookie)

转载 作者:行者123 更新时间:2023-12-03 14:13:41 25 4
gpt4 key购买 nike

我在将 Google Optimize 与 React 应用程序一起使用时遇到了问题(例如 https://quality.livechatinc.com/1520 )。应运行一个简单的 A/B 测试(文本替换)。

测试的预览以某种方式工作(设置 gaexp cookie,并且在预览模式下,仅在重新加载页面**后,变体才会触发)。

发布测试时,未设置 cookie,测试无法完全运行。

以下是 GA/GTM/Optimize 的实现:

//Page-hiding snippet.
<style>.async-hide { opacity: 0 !important} </style>
<script>(function(a,s,y,n,c,h,i,d,e){s.className+=' '+y;h.start=1*new Date;
h.end=i=function(){s.className=s.className.replace(RegExp(' ?'+y),'')};
(a[n]=a[n]||[]).hide=h;setTimeout(function(){i();h.end=null},c);h.timeout=c;
})(window,document.documentElement,'async-hide','dataLayer',4000,
{'GTM-XXXXXX':true});</script> //instead of X we have our Optimize container ID

//Optimize code without ga(`send`), as we use GTM to send pageviews
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-XXXXXX-XX', 'auto'); //instead of X we have our GA tracking code
ga('require', 'GTM-XXXXXXX'); //instead of X we have our Optimize container ID
</script>

//GTM code
<!-- Google Tag Manager -->
<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=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-XXXXXXX');</script>
<!-- End Google Tag Manager -->

代码位于 <head> 中应用程序的,就在 <meta> 之后和<links> .

我尝试使用自定义 dataLayer 事件触发 Optimize 测试,如 Optimize 文档建议 ( https://support.google.com/360suite/optimize/answer/7008840?hl=en ),但它没有解决问题。

我尝试清除和禁用缓存/cookie,并检查测试是否在各种浏览器、隐身模式、计算机中有效 - 没有任何效果。

您有在 React 应用中使用 Google Optimize 的经验吗?有什么想法可以解决这个问题吗?

提前致谢!

米哈乌

<小时/>

** 这可能暗示正在发生什么,但我不知道为什么会发生。

最佳答案

即使认为这是一个有点老的问题,你可能已经解决了这个问题,我也有类似的问题,而且很难找到正确的解决方案。对于那些仍在为此苦苦挣扎的人来说。

所以,你所做的一切都是正确的,但是我认为你没有在 DOM 更改时触发 dataLayer 事件,因此你需要添加观察者函数来执行此操作。

这是应该在 之前但在所有脚本之后添加到末尾某处的代码示例。 (也可以在index.html中)

<!-- This will send an activate event to Optimize, anytime that there is a change in the DOM --> 
<script>
window.dataLayer = window.dataLayer || [];
if (MutationObserver) {
new MutationObserver(function(){
dataLayer.push({'event': 'optimize.activate'});
}).observe(document.body, {subtree: true, attributes: true, characterData: true});
}
</script>

此外,不要忘记在“优化”中进行设置,以激活针对自定义事件而不是页面加载的实验(如此处所述 https://support.google.com/360suite/optimize/answer/7008840?hl=en )

关于reactjs - Google Optimize 无法与 React App 配合使用(未设置 cookie),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45608687/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com