Chrome隐身模式禁用第三方Cookie时iframe无法设置Cookie求助

我正在适配Chrome即将到来的第三方Cookie变更，我的页面被其他域的网站嵌入iframe，页面中设置的Cookie仅需在该父站上下文的iframe中可见（并非真正的第三方Cookie）。这个场景在禁用第三方Cookie的Firefox中能正常运行，但在禁用第三方Cookie的Chrome隐身模式下，无法设置Cookie——刷新父页面后Cookie丢失（实际从未被创建），Chrome开发者工具没有警告，但Application标签里能看到Cookie没被创建。

示例代码 #

父页面（domain1.com） #

<html>
    <head>
        <style>
            iframe.myframe {
                width: 800px;
                height: 500px;
            }
        </style>
    </head>
    <body>
        <iframe class="myframe" src="https://domain2.com/my_thing.html"/>
    </body>
</html>

子页面（domain2.com） #

<html>
    <head>
        <style> body{ background: blue; } </style>
    </head>
    <body>
        <script>
            let num = getCookie('num');
            console.log('Pre-change: '+num);
            num = (parseInt(num)||0) + 1;

            document.cookie = "num="+num+"; SameSite=None; Secure";

            console.log('Post-change: '+num);


            function getCookie(cname) {
                let name = cname + "=";
                let ca = document.cookie.split(';');
                for(let i = 0; i < ca.length; i++) {
                    let c = ca[i];
                    while (c.charAt(0) == ' ') {
                        c = c.substring(1);
                    }
                    if (c.indexOf(name) == 0) {
                        return c.substring(name.length, c.length);
                    }
                }
                return "";
            }
        </script>
    </body>
</html> 

原因分析 #

Chrome和Firefox对第三方Cookie的判定与拦截逻辑存在核心差异：

• Firefox在禁用第三方Cookie时，允许仅绑定嵌入上下文的Cookie，只要配置SameSite=None; Secure就能正常存储。
• Chrome的隐身模式（以及即将全面推行的第三方Cookie限制）采用更严格的规则：只要是跨域iframe中的Cookie，直接归类为第三方Cookie范畴，不会因为你只在该上下文使用就放宽限制。即使设置了SameSite=None; Secure，缺少额外的信任凭证或分区标识，Cookie会被静默拦截，且不会触发控制台警告。

解决办法 #

1. 使用Partitioned属性（推荐） #

Chrome支持Partitioned属性，专门用于跨域iframe场景，能让Cookie绑定到嵌入的父站上下文，完全匹配你“仅在该父站iframe中可见”的需求。修改子页面的Cookie设置代码：

document.cookie = "num="+num+"; SameSite=None; Secure; Partitioned";

这个属性是Chrome为第三方Cookie淘汰推出的官方解决方案，Cookie会被隔离存储在父站的上下文分区中，不会被当作第三方Cookie拦截。

2. 通过Storage Access API请求权限 #

如果无法使用Partitioned，可以调用Chrome的Storage Access API主动请求存储权限，但需要用户交互触发（比如点击事件），否则会被拦截：

async function setCookieWithAccess() {
  if (document.hasStorageAccess) {
    try {
      await document.requestStorageAccess();
      // 权限获取成功后设置Cookie
      document.cookie = "num="+num+"; SameSite=None; Secure";
    } catch (err) {
      console.error("存储权限请求失败", err);
    }
  }
}
// 绑定到用户点击事件，比如页面内按钮
document.addEventListener('click', setCookieWithAccess);

3. 改用非Cookie存储方案 #

如果上述Cookie方案受限，可以考虑替代方案：

• Session Storage：仅在当前iframe会话生效，刷新父页面后丢失，适合临时状态存储。
• 父页面托管状态：通过postMessage在父页面与iframe间传递数据，将状态存储在父页面的LocalStorage或Cookie中，子页面需要时从父页面获取。

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