为什么当我的应用在跨域iframe中加载时，Google Analytics没有发送点击量？

Question

我有一个基本的静态/单页应用程序，我使用gtag添加了Google Analytics 4（GA4）。当我通过http://localhost:8080本地加载我的应用程序时，页面浏览量得到了跟踪。然而，当我将我的应用程序嵌入到另一个站点的iframe中时，就没有发送任何记录。

为了调试它，我查看了Chrome网络检查器中的网络请求。当我直接在http://localhost:8080打开我的应用程序时，我可以看到一个请求发送到https://analytics.google.com/g/collect?..。但是，当我在iframe中加载我的应用程序（例如，我在另一个页面中添加<iframe src=“http://localhost:8080”></iframe>）时，我注意到这个请求没有被发送。我还确认实时视图中没有数据显示在Google Analytics中，尽管我可以看到gtag加载的JavaScript。

我还使用https://tagassistant.google.com/的标签助手进行了调试。即使我连接到在iframe中运行的应用程序，调试器也显示所有事件都按预期注册，但在发送的记录中，它说“此容器未发送任何记录”。

同样的跟踪代码，在应用程序加载在iframe中时为什么会有不同的行为？如何确保记录始终被发送？

更新：这似乎与跨域iframe中无法使用cookie相关，但有解决方法吗？

- jon_wu

---

我投票关闭此问题，因为它与编程无关，可能更适合 https://webapps.stackexchange.com/ 或 https://webmasters.stackexchange.com/。 - Linda Lawton - DaImTo

Answer 1

默认情况下，由于SameSite cookie设置强制执行，跟踪失败。默认情况下，在第三方上下文中不可用的cookie包括从不同域包含的iframe。

通过使用cookie_flags配置 (文档)，您可以允许从第三方上下文读取cookie。由于隐私限制不断增加，这将因浏览器而异并存在某些注意事项。

然而，目前，在gtag配置中设置cookie_flags 可以解决问题，只要您的站点是安全的就行：

gtag('config', '<MEASUREMENT_ID>', {
  cookie_flags: 'SameSite=None;Secure'
})

请注意，由于http://localhost:8080不安全，因此这实际上无法使用，但是一旦网站部署到生产环境中，希望您会使用https。

- jon_wu

---

非常感谢。我在这个问题上卡了很长时间。这个问题只出现在Chrome浏览器上。他们应该在他们的文档中提到这一点。 - chetan