如何通过GTM监听JS事件并在GA4中追踪该事件

1. 更新自定义HTML标签的回调函数 #

把你当前GTM里的自定义HTML标签代码修改为：

function doThis() {
  // 将事件推送到GTM的dataLayer
  window.dataLayer = window.dataLayer || [];
  dataLayer.push({
    event: "myapp_triggered_event", // 自定义事件名，后续GTM要用到
    // 可选：添加事件参数，比如 event_source: "第三方应用SDK"
  });
}

$myApp.push(["on", "event:triggered", doThis]);

注意：如果你的第三方SDK加载时机晚于「窗口加载完成」，可能需要调整触发器（比如改成监听SDK加载完成的自定义事件），避免$myApp未定义报错。

2. 在GTM中创建GA4事件标签 #

• 新建标签，选择标签类型为GA4事件
• 在「配置标签」下拉框中选择你已创建的GA4配置标签（带测量ID的那个）
• 「事件名称」填写和dataLayer中一致的名称，比如myapp_triggered_event
• （可选）如果需要传递参数，在「事件参数」中添加对应键值对，键名要和dataLayer里的参数一致
• 触发器选择自定义事件，事件名称填myapp_triggered_event，保存标签

3. 验证与查看数据 #

• 启用GTM预览模式，触发第三方SDK的event:triggered事件，检查dataLayer是否有对应的推送，且GA4事件标签是否正常触发
• 打开GA4的「实时」报告，能即时看到该事件的触发数据
• 等待1-2小时后，在GA4的「事件」报告中，就能像查看页面浏览量一样看到该事件的统计数据

内容的提问来源于stack exchange，提问作者apatik