有没有人成功在SPA React应用程序中实现Google优化?

时间:2018-06-05 19:19:01

标签: reactjs google-analytics google-optimize react-ga

我是Google Analytics Suite的新手,目前我正在尝试将Google Optimize用于应用程序中的A / B测试。

我已经达到变量更改在所需网页上显示的程度,但仅限于预览模式,并且难以了解如何继续查看实际网站上的变体更改。

到目前为止:

  • google优化脚本安装在应用

    <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-XXXXXXX':true});</script>

  • 使用ReactGA

  • 设置ga跟踪
  • GTM已设置并正在触发标记以跟踪
  • 针对自定义激活事件触发google优化实验,并使用dataLayer推送新事件

    const initializeReactGa = () => { console.log('called to initialize react ga'); ReactGA.initialize(config.gaTag) ReactGA.ga('require', config.optimizeTag); ReactGA.pageview(window.location.pathname + window.location.search); }

    const googleOptimizeLoader = () => { console.log('called google optimize loader'); if(window.dataLayer) { window.dataLayer.push({'event': 'optimize.activate'}) } }

问题

  • 无法查看实时网站中的变体更改(未预览运行)

感谢任何帮助。

TIA

Nayyir

[解决]

能够确定问题与设置无关。问题是google optimize的Cookie管理无法为localhost:3000上的过期设置所需的Cookie,而是指向localhost的自定义域,类似于XXXX.local:3000

1 个答案:

答案 0 :(得分:1)