title: Google Analytics blocked in IFrame due to "SameSite" & "Secure" setting of cookies
body: <p>We're running a service on <code>our-site.com</code>. Our customers can either use the service "stand alone" by simply linking from <code>their-site.com</code> to <code>our-site.com/customer-service</code> or by embedding our service via iFrame into <code>their-site.com</code>. Imagine visiting GMaps directly vs. seeing it embedded in an IFrame.</p>
  
  <h1>Visiting "foreign" page with our service in IFarme</h1>
  
  <p>Beginning with Chrome 80 (i guess) our Google Analytics stopped working when the service runs inside the iFrame. Chrome is giving me this (quite clear) message:</p>
  
  <blockquote>
    <p>A cookie associated with a cross-site resource at <a href="http://our-site.com/" rel="noreferrer">http://our-site.com/</a> was set without the <code>SameSite</code> attribute. It has been blocked, as Chrome now only delivers cookies with cross-site requests if they are set with <code>SameSite=None</code> and <code>Secure</code>. You can review cookies in developer tools under Application>Storage>Cookies and see more details at <a href="https://www.chromestatus.com/feature/5088147346030592" rel="noreferrer">https://www.chromestatus.com/feature/5088147346030592</a> and <a href="https://www.chromestatus.com/feature/5633521622188032" rel="noreferrer">https://www.chromestatus.com/feature/5633521622188032</a>.</p>
  </blockquote>
  
  <p>Also I don't see anything in the GA realtime overview if I visit <code>their-site.com</code> with our <code>our-site.com/customer-service</code> embedded in the iFrame.</p>
  
  <p>If I manually disable the 2 features <code>same-site-by-default-cookies</code> &amp; <code>cookies-without-same-site-must-be-secure</code> in <code>chrome://flags</code> and visit <code>their-site.com</code> with <code>our-site.com/customer-service</code> embedded in the iFrame I do see the page visit in the GA realtime overview.</p>
  
  <h1>Visiting our service "stand alone"</h1>
  
  <p>When directly visiting <code>our-site.com/customer-service</code> GA is still working just fine:</p>
  
  <ul>
  <li>No warnings in dev tools</li>
  <li>Multiple cookies associated to GA are shown in dev tools > applications tab</li>
  <li>I can see page visits in the GA realtime overview</li>
  <li>Neither of the cookies has the <code>Secure</code> or <code>SameSite</code> value set (all "blank")...</li>
  </ul>
  
  <h1>Question</h1>
  
  <p>Is there anything I can do to make GA work again when running inside an iFrame on a foreign domain?</p>
  
  <h1>Example code</h1>
  
  <p>I just created a very simple test environment which also shows the issues described above:</p>
  
  <p><em>our-site.com/customer-service</em></p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;html lang="en"&gt;
    &lt;head&gt;
      &lt;!-- Global site tag (gtag.js) - Google Analytics --&gt;
      &lt;script async src="https://www.googletagmanager.com/gtag/js?id={tracking-id}"&gt;&lt;/script&gt;
      &lt;script&gt;
        window.dataLayer = window.dataLayer || [];
        function gtag() { dataLayer.push(arguments); }
        gtag("js", new Date());
        gtag("config", "{tracking-id}");
      &lt;/script&gt;
  
      &lt;meta charset="UTF-8" /&gt;
      &lt;meta name="viewport" content="width=device-width, initial-scale=1.0" /&gt;
      &lt;title&gt;our site service&lt;/title&gt;
    &lt;/head&gt;
    &lt;body&gt;our-site.com/customer-service&lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p><em>their-site.com</em></p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;html lang="en"&gt;
    &lt;head&gt;
      &lt;meta charset="UTF-8" /&gt;
      &lt;meta name="viewport" content="width=device-width, initial-scale=1.0" /&gt;
      &lt;title&gt;their-site.com&lt;/title&gt;
    &lt;/head&gt;
    &lt;body&gt;
      &lt;iframe src="https://www.our-site.com/customer-service" style="width: 500px; height: 500px;"&gt;&lt;/iframe&gt;
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>Even this very simple example shows the behavior described above, where opening <code>our-site.com/customer-service</code> directly, shows data in the GA realtime overview and opening <code>their-site.com</code> doesn't...</p>