8

我正在尝试按照这些说明在 JavaScript 中获取 Google Optimize 实验数据。但是我没有得到回调，也看不到调试器中发生的任何事情。

链接说明使用gtag方式配置GA，所以我按照https://developers.google.com/gtagjs/devguide/snippet设置gtag，按照https://support.google.com/配置Optimize optimize/answer/7513085?hl=en使用方法 1：使用全局网站代码 (gtag.js) 安装 Optimize。

我想展示我正在使用的确切代码，但由于我是在 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}');
                                gtag('event', 'optimize.callback', {
                                    name: '${process.env.EXPERIMENT_ID}',
                                    callback: o => console.log(o)
                                });
                            `
                        }}
                    />
                </Head>
                <body>
                    <Main />
                    <NextScript />
                </body>
            </html>
        )
    }
}

此代码生成一个结果页面，该页面启动分析并跟踪 pageView，就像它应该的那样，当我在 Google Optimize 控制台中执行“运行诊断”时，它会打开页面，检查 JavaScript 并报告：

优化已正确安装

在此页面上验证 Optimize 安装时未检测到重大问题。

我还安装了 Google Chrome Tag Assistant 插件，它报告 Google Optimize 标签已正确安装。

我可以在网络日志中看到以下调用：

https://www.googletagmanager.com/gtag/js?id=UA-xxxxxx
https://www.google-analytics.com/analytics.js
https://www.google-analytics.com/gtm/js?id=GTM-xxxxxx&t=gtag_UA_xxxx&cid=nnn.nnn

我还验证了google_optimize全局变量是否已创建，并且它有一个.get()方法。如果我（在调试器网络面板中）https://www.google-analytics.com/gtm/js?...查看请求的 http 响应，我实际上可以看到代码中嵌入了正确实验的 Google 优化实验数据。

optimize.callback所以一切看起来都很好，除了这个事件似乎是一个完全没有操作的事实。它根本不做任何事情。而且我不知道如何访问我在调试器的 http 响应中看到的实验数据。

4

1 回答 1

20

所以我终于弄清楚是什么导致了我的挣扎：我是从本地 NodeJS 服务器上运行的，在通常的http://localhost:3000url 上。事实证明，谷歌优化永远不会触发对http://localhost/...url 的实验。代码hostname需要可以根据host.domain方案解析的部分 url。

换句话说，主机名中必须有一个点，Optimize 才能触发实验。

对于本地测试，可以通过创建主机名别名（例如localhost.domainfor 127.0.0.1）并使用此别名访问网页来解决此问题。

于 2019-06-17T16:49:30.640 回答