COOP same-origin 不会阻止跨域 iframe 访问顶层 window，但强制隔离浏览上下文组：跨源 opener 恒为 null，同源弹窗仍可通信；必须通过服务器响应头设置，meta 标签无效，且需配合 COEP: require-corp 才能启用 SharedArrayBuffer 等高权限 API。
COOP same-origin 会阻止跨域 iframe 访问顶层 window 吗
不会自动阻止，但会强制隔离浏览上下文——这是关键区别。设置 Cross-Origin-Opener-Policy: same-origin 后，若当前页面被其他源（比如 https://evil.com）用 window.open() 或链接打开，浏览器将拒绝共享浏览上下文组（Browsing Context Group），导致：对方无法通过 opener 引用你，你也无法通过 open() 返回的句柄访问对方；即使同域名但不同协议/端口（如 http://a.com 和 https://a.com）也被视为跨源，同样隔离。
如何正确设置 COOP same-origin 响应头
必须由服务器返回 HTTP 响应头，HTML 的 <meta> 标签**完全无效**——这是最常踩的坑。常见错误是写成：
<meta http-equiv="Cross-Origin-Opener-Policy" content="same-origin">
这毫无作用。正确方式只有以下几种：
- Nginx 配置：
add_header Cross-Origin-Opener-Policy "same-origin"; - Express.js：
res.setHeader('Cross-Origin-Opener-Policy', 'same-origin'); - Apache：
Header set Cross-Origin-Opener-Policy "same-origin"（需启用 mod_headers）
注意：该头必须与 COEP: require-corp 搭配使用才能启用某些高级隔离能力（如 SharedArrayBuffer），但仅实现顶层窗口隔离时，COOP 单独生效即可。
立即学习“前端免费学习笔记（深入）”；
Article To Html
下载
文章转信息图。将文章/笔记转化为手机可读的 HTML 信息图，自动匹配视觉风格。触发场景：文章转图、笔记转图、信息图、转小红书图、做张图、可视化这篇文章、文生图。
same-origin 和 same-origin-allow-popups 的实际差异
两者都限制 opener 关系，但行为不同：
-
same-origin：彻底断开跨源 opener，调用window.open()打开跨源页面时，返回的window对象为null，且新页面的opener为null -
same-origin-allow-popups：允许同源 popups 保持 opener 关系，但跨源 popups 仍被隔离；适用于需要嵌入同源管理后台弹窗的场景 - 若页面本身是跨域 iframe（如嵌在第三方网站中），COOP 头只影响该 iframe 自身的顶层窗口关系，不影响其父页面
检查 COOP 是否生效的最快方法
打开 Chrome DevTools → Application → Frames → 查看当前 frame 的 “COOP” 列值；或直接运行：
console.log(document.featurePolicy?.features?.['cross-origin-opener-policy']);
更可靠的是检查响应头：
- Network 面板选中 HTML 请求 → Headers → Response Headers → 确认存在
Cross-Origin-Opener-Policy: same-origin - 若看到
unsafe-none或头缺失，则隔离未启用 - 若同时设置了
unsafe-none（例如某些 CDN 默认注入），它会覆盖你自己的 COOP 设置
真正起效后，尝试从另一个源页面执行 const w = window.open('https://yoursite.com'); console.log(w);，结果一定是 null —— 这才是隔离落地的信号。
