由于Cookie的“ SameSite”和“安全”设置，iFrame中的Google Analytics（分析）被阻止

时间：2020-03-23 19:10:19

标签： javascript cookies iframe google-analytics samesite

我们正在our-site.com上运行服务。我们的客户可以通过简单地将their-site.com链接到our-site.com/customer-service或通过iFrame将我们的服务嵌入their-site.com中来“独立使用”服务。想象一下直接访问GMap，而不是将其嵌入到IFrame中。

通过IFarme服务访问“外国”页面

从Chrome 80开始（我想），当该服务在iFrame中运行时，我们的Google Analytics（分析）已停止工作。 Chrome给了我这个（非常清楚的）信息：

设置了与http://our-site.com/处的跨站点资源关联的cookie，但未设置SameSite属性。它已被阻止，因为Chrome现在仅在将跨站点请求设置为SameSite=None和Secure的情况下才提供cookie。您可以在Application> Storage> Cookies下的开发人员工具中查看Cookie，并在https://www.chromestatus.com/feature/5088147346030592和https://www.chromestatus.com/feature/5633521622188032上查看更多详细信息。

如果我访问their-site.com并且将our-site.com/customer-service嵌入到iFrame中，那么我在GA实时概述中什么也看不到。

如果我手动禁用same-site-by-default-cookies中的两个功能cookies-without-same-site-must-be-secure和chrome://flags并使用嵌入在iFrame中的their-site.com访问our-site.com/customer-service，我会看到页面访问在GA实时概述中。

“独立”访问我们的服务

直接访问our-site.com/customer-service时，GA仍然可以正常运行：

  • 开发工具中没有警告
  • 与GA关联的多个cookie在开发工具>“应用程序”标签中显示
  • 我可以在GA实时概述中看到网页访问
  • 这两个Cookie均未设置Secure或SameSite值（全部为“空白”）...

问题

在外部域的iFrame中运行时，是否可以做些什么使GA重新工作？

示例代码

我刚刚创建了一个非常简单的测试环境，该环境还显示了上述问题：

our-site.com/customer-service 

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

    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>our site service</title>
  </head>
  <body>our-site.com/customer-service</body>
</html>

their-site.com 

<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>their-site.com</title>
  </head>
  <body>
    <iframe src="https://www.our-site.com/customer-service" style="width: 500px; height: 500px;"></iframe>
  </body>
</html>

即使这个非常简单的示例也显示了上述行为，其中直接打开our-site.com/customer-service会显示GA实时概述中的数据，而打开their-site.com却不会...

1 个答案:

答案 0 :(得分：3)

Google tag manager support forum的答案：

在第三方上下文（iframe）中访问第一方Cookie（_ga）时，必须显式添加cookieFlags，其值为samesite=none;secure。

有关各种情况的详细说明，请参见this blogpost。

相关问题
最新问题