我使用Google Optimize创建了A/B测试.现在我想在Javascript中阅读当前的ExperimentId和variationId.我的目标是根据给定的变体运行不同的javascript.
我似乎无法在文档中找到任何相关信息.可能吗?
标题可能看起来有点含糊,但这是因为我目前在将 Google Optimize 集成到我们的 React / Next.js 项目中时遇到了多个问题。我将尝试尽可能详细地解释我的问题和行动。但是,如果有不清楚的地方,请告诉我。
<Html lang="en" className="async-hide">
<Head>
{/*
Google Optimize Ant-Flicker Snippet
https://support.google.com/optimize/answer/9692472?ref_topic=6197443
*/}
<style
dangerouslySetInnerHTML={{
__html: `.async-hide { opacity: 0 !important}`,
}}
/>
<script
dangerouslySetInnerHTML={{
__html: `
(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,
{'OPT-OPTIMIZE_ID':true});
`,
}}
/> …Run Code Online (Sandbox Code Playgroud) 如何在Google Optimize广告系列中运行窗口加载或文档准备好的javascript?看起来它允许我选择DOM元素一直到Body,但我需要在文档就绪上运行js.
我正在使用 Google 标签管理器容器来管理脚本。我正在尝试执行服务器端优化/分析实验。出于性能原因,我需要服务器端。我已经对 GTM/Optimize 容器进行了很好的客户端实验。
这是我的 GTM 代码:
window.dataLayer = window.dataLayer || [];
....
<!-- 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-XXXXXXXX');</script>
<!-- End Google Tag Manager -->
Run Code Online (Sandbox Code Playgroud)
我尝试了以下不同的方法来触发要触发的变化。
// These fn get called only once GA exists via setTimeout. They get called correctly.
// I've setup the experimentTrigger via GTM container and it triggers correctly to Analytics.
function setGAExperiment1(_expIdvId){
// Matches ga('set', 'exp', '$experimentId.$variationId');
// https://developers.google.com/optimize/devguides/experiments
ga('set', 'exp', _expIdvId);
dataLayer.push({'event': 'experimentTrigger', 'exp': _expIdvId }); // …Run Code Online (Sandbox Code Playgroud) javascript google-analytics google-tag-manager google-optimize
我想知道是否可以使用 Google Optimize 和 Google Tag Manager 设置多个服务器端实验。我们关注了/sf/answers/3651048621/,它似乎对从数据层发送的值工作得很好,但考虑到 Analytics 变量名称(expId 和 expVar),感觉我们只能这样做在任何给定时间进行一次实验。
我是Google Analytics Suite的新手,目前正在尝试将Google Optimize for A / B测试集成到react应用中。
我已经了解到变体更改将显示在所需的网页上,但仅在“预览”模式下显示,并且对如何继续在实时网站上查看变体更改感到困惑。
谷歌优化脚本安装在应用程序中
<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跟踪
触发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
纳耶尔
[解决了]
能够确定问题与安装无关。问题是,谷歌优化的cookie管理无法设置过期所需的cookie localhost:3000,而是指向的自定义域localhost,类似于XXXX.local:3000。
在一个NextJS/ReactJS项目中,我尝试设置 Google Optimize 进行一些实验。不过,我想避免的是优化在每次实验中更改视觉元素时所产生的闪烁效果。
为此,我使用了谷歌建议的抗闪烁脚本。现在,虽然这在初始加载时有效,实际上“隐藏”整个页面一段时间以便 Optimize 应用更改,但这对我的客户端路由情况不起作用,因为页面的完全重新加载会起作用在这种情况下不会发生。
因此,我“避免”在初始页面加载时闪烁,但我没有设法使其在客户端路由方面工作,因为初始脚本不会再次执行 - 即使它执行了,结果也不会理想。
请注意,隐藏和重新显示页面不是一个选项(例如通过历史更改事件重新启动脚本),因为这会破坏客户端路由提供的连续性。另外,暂时隐藏闪烁的组件并不容易,因为我不确定应该在路由过程的哪一步隐藏它,并且我没有设法使其以有效的方式显示。想法?
预先非常感谢您。
更新:
A/B测试工作正常.
重定向测试正在运行但未报告.
我在Google 使用 Google跟踪代码管理器部署Google Analytics时遵循了Google的文章如何使用优化,但我在Google Optimize上遇到错误:
似乎有些不对劲.您的实验正在运行但未接受访问.
我使用了Analytics调试器,一切似乎都很好,所以我在寻求你的帮助.
这是我的设置:
<meta charset="utf-8">
<script>dataLayer = [...]</script>
//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 …Run Code Online (Sandbox Code Playgroud) google-analytics google-tag-manager universal-analytics google-optimize
我正在使用 Google 优化运行 A/B 重定向测试,在 React、Redux 平台上使用 SPA。
我正在尝试解决的一个问题是 - 重定向到新页面会导致整个页面重新加载,我想避免这种情况,而是更喜欢手动进行,因此它对用户来说是无缝的,而且速度要快得多。
有没有办法做到这一点?
redirect single-page-application reactjs react-redux google-optimize
我正在使用 Google Optimize 来创建 A/B 测试。我在服务器端模式下使用它,如本指南所示:https : //developers.google.com/optimize/devguides/experiments
该指南展示了一种简单的方法,通过在服务器上呈现设置实验 ID 和变体 ID 的 JS 代码来设置哪个实验与哪个变体一起运行:
// 2. Create a tracker.
ga('create', 'UA-XXXXX-Y', 'auto');
<?php
<<<HTML
// 3. Set the experiment ID and variation ID.
ga('set', 'exp', '$experimentId.$variationId');
HTML;
?>
// 4. Send a pageview hit to Google Analytics.
ga('send', 'pageview');
Run Code Online (Sandbox Code Playgroud)
但是,我正在使用 Google 标签管理器,到目前为止还没有找到任何说明如何使用它从服务器设置变量的指南。ga是一个未定义的变量,所以上面的方法不起作用。
我正在按照以下说明尝试通过JavaScript获取Google Optimize实验数据。但是我没有回调,也看不到调试器中发生的任何事情。
链接的说明使用了配置Google Analytics(分析)的gtag方式,因此我已根据https://developers.google.com/gtagjs/devguide/snippet设置了gtag ,并根据https://support.google.com/配置了Optimize 使用方法1 优化/ answer / 7513085?hl = zh-CN :使用全局站点标签(gtag.js)安装优化。
我想显示我正在使用的确切代码,但是由于我是在React与Next.js服务器端渲染中进行的,因此与纯HTML + JS相比,原始代码有一些额外的东西。来源看起来像这样:
require("dotenv").config()
import React from "react"
import Document, { Head, Main, NextScript } from "next/document"
export default class extends Document {
render() {
return (
<html>
<Head>
<script async src={`https://www.googletagmanager.com/gtag/js?id=${process.env.GA_TRACKING_ID}`}/>
<script
dangerouslySetInnerHTML={{
__html: `
window.dataLayer = window.dataLayer || [];
function gtag(){ dataLayer.push(arguments); }
gtag('js', new Date());
gtag('config', '${process.env.GA_TRACKING_ID}', { optimize_id: '${process.env.OPTIMIZE_ID}'});
console.log('GA setup done: ${process.env.GA_TRACKING_ID} + ${process.env.OPTIMIZE_ID}'); …Run Code Online (Sandbox Code Playgroud) 我正在尝试设置一个 Google Optimize 容器用于 A/B 测试+其他。我遇到的问题是我肯定需要链接到 Google Analytics 才能衡量结果。当我尝试链接到 Google Analytics(分析)媒体资源时,只会显示我拥有的 Universal Analytics 媒体资源(我实际上并未使用),但不会显示我实际使用的 Google Analytics(分析)4 媒体资源。难道我做错了什么?Google 还没有真正实现这种连接吗?
TL;DR:Google Analytics 4 属性在 Google Optimize 容器中未显示为可链接。
我需要一些关于使用 gtag.js(来自 Google 的新全局标签)优化的服务器端实现的帮助。
使用analytics.js,就像ga('set', 'exp', 'experimentid.0');可以在这里找到手册一样简单
设置 gtag.js 后应该像这样工作: gtag('set', {'exp': 'experimentid.0'});,但 Google Optimize/Analytics 不会获取这些值。我尝试将它放在 config 标签之前和 config 标签中作为附加配置信息。gtag('config', '<target_ID>', {<additional_config_info>});
此外,我还尝试更改 expId 中的 exp(如本页上的示例)但无济于事。
有人有可用的 server_side 优化代码或可以帮助我吗?
google-optimize ×13
reactjs ×4
javascript ×3
next.js ×3
gtag.js ×1
react-ga ×1
react-redux ×1
redirect ×1
routes ×1
server-side ×1