Google Analytics Web+App 事件配置：错误 'gtag is not defined'

Question

我正在尝试为网站设置 Google Analytics App+Web 的电子商务事件配置。参考文档 here.

因为电子商务配置有很多自定义代码，我不能使用通用的 GA App+Web webevent 模板，所以我在这种情况下使用自定义 HTML-tag。

作为第一次测试，我尝试触发以下简单事件：

<script>

  gtag('event', 'blabla', {
  'test_param1': 'test_value_1'
});

</script>

但是，事件没有正确发送到 GA；相反，在控制台中返回以下错误：

未捕获的引用错误：未定义 gtag

重现见下页：https://www.hema.nl/mooi-gezond/make-up/make-up-accessoires/toilettassen-1/toilettas-11830901.html

附加信息：

GA App+Web 基础初始化通过 GTM，通过 GA App+Web 配置模板标签（成功）完成。
我还通过 GA App+Web webevent 模板标签通过 GTM 配置了一些其他（简单的非电子商务）GA App+Web 事件，这些事件已成功发送到 GA。

有谁知道出了什么问题，为什么会出现控制台错误以及为什么事件没有发送到 GA？

Answer 1

问题原因已找到。问题似乎是，如果 App+Web 基本设置是使用 GTM App+Web 基本模板标签完成的，则 gtag() 不起作用。相反，应该首先将事件推送到 GTM 数据层，然后使用 GTM App+Web 事件模板将事件发送到 Google Analytics。

非常感谢 Gino（在 Merkle 工作）解决了这个问题！

Answer 2

简答

除了 GTM GA App+Web 代码之外，您还需要添加以下代码来定义 gtag()：

<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
</script>

长答案

根据官方文档 (https://developers.google.com/analytics/devguides/collection/ga4)，这是您应该包含在站点中的代码：

<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=MEASUREMENT_ID"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'MEASUREMENT_ID');
</script>

检查带有此标签的网站后，我发现 GTM 已注入第一行，这足以使分析工作正常进行。但它没有添加其他行，其中一些有效地将 gtag 全局函数定义为“语法糖”，用于将内容推送到分析数据层。

就我个人而言，我觉得这真的很奇怪，因为使用 GTM 是向网站添加 Google 分析最规范的方法，而且它是由同一家公司提供的。

Answer 3

在我的例子中 Uncaught ReferenceError: gtag is not defined 是由 uBlock/adblock 开启引起的。

如果接受的答案不起作用，我认为值得测试。

Answer 4

如果您使用的是 Google 跟踪代码管理器，则 gtag 功能不存在。按照本指南 create custom events

基本上你使用的代码是

dataLayer.push({event: 'event_name'});

然后您在 GTM 中为 GA4 事件设置了一个代码。使用您想在 Google 分析中看到的事件名称。对于触发器，使用自定义事件。在这里，在事件名称中，使用您在代码中使用的名称 event_name

Answer 5

我发现这是由于 AD Blocking Extensions 添加到我的 chrome

Answer 6

2022年答案：

对于在您的 SPA/Angular/React 应用中同时使用 GA4 gtag 和 GTM（Google 跟踪代码管理器）苦苦挣扎的每个人，您应该做下一步：

不要使用built-in GTM 的“Google Analytics：GA4 配置”标签配置
do 使用“自定义 HTML”GTM 标签以及 Google Analytics 中的 gtag JS 代码，即

<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id= GA_MEASUREMENT_ID"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'GA_MEASUREMENT_ID');
</script>

之后，您可以按照预期在代码中使用 gtag，一切都应该有效。不需要整个 Firebase 之类的东西。可能你需要

gtag('config', 'GA_MEASUREMENT_ID', {
  send_page_view: false
});

禁用自动 page_view 跟踪。

Google Analytics Web+App 事件配置：错误 'gtag is not defined'

Google Analytics Web+App event config: Error 'gtag is not defined'

google-analytics

google-tag-manager

简答

长答案