document.domain已失效，现代浏览器禁用其跨域降域功能；postmessage是唯一通用、安全、现代的替代方案，需校验origin和targetorigin。
document.domain 只能用于同主域、不同子域的场景，且现代浏览器（Chrome 89+、Firefox 79+）已默认禁用该 API 的跨域降域能力——它不再解除同源策略限制，仅保留读取功能。直接设 document.domain 已无法让 iframe.contentWindow 或 parent 互相访问 DOM/JS。
以下方案聚焦「真正可用」的替代路径，不讲已失效或需旧版浏览器支持的方法。
为什么 document.domain 现在基本失效了
Chrome 从 v89（2021 年起）、Firefox 从 v79（2020 年起）开始，将 document.domain 设为只读属性。即使你写了 document.domain = 'example.com'，实际值不变，也不会触发同源放宽。控制台会静默忽略，但 iframe.contentDocument 仍抛出 SecurityError。
常见错误现象：
Uncaught DOMException: Blocked a frame with origin "https://a.example.com" from accessing a cross-origin frame.-
Cannot read property 'document' of null（iframe.contentWindow返回null） -
document.domain赋值后打印仍是原始子域名，未变化
postMessage 是唯一通用、安全、现代的替代方案
它不要求同主域，不限制协议/端口/子域，且所有主流浏览器（包括 iOS Safari）自 2012 年起就完整支持。关键在于父子双方都主动监听并校验来源。
实操要点：
- 父页发消息必须指定
targetOrigin，不能写'*'（尤其生产环境） - 子页收到消息后，必须检查
event.origin是否可信（比如只允许'https://b.example.com'） - 避免在
message事件里直接执行eval()或插入 HTML 字符串 - 若需双向通信，子页也要调用
event.source.postMessage()回传，而非依赖window.parent
示例（父页）：
const iframe = document.getElementById('myIframe');
iframe.onload = () => {
iframe.contentWindow.postMessage(
{ type: 'init', data: { token: 'abc123' } },
'https://b.example.com' // 必须精确匹配协议+域名+端口
);
};
window.addEventListener('message', (e) => {
if (e.origin !== 'https://b.example.com') return;
if (e.data.type === 'ready') {
console.log('子页已就绪:', e.data.payload);
}
});
当必须读写 iframe 内 DOM 时，Nginx 反向代理是更可控的解法
如果业务逻辑强依赖直接操作子页 DOM（比如注入样式、劫持按钮 click），又无法改造子页加 postMessage，反向代理可把跨域变成同源。
适用前提：
- 你控制父页服务器（如 Nginx）
- 子页服务允许被代理（无
X-Frame-Options: DENY或严格CSP） - 子页不依赖绝对 URL（或可通过
base href修正）
Nginx 配置片段：
location /proxy-b/ {
proxy_pass https://b.example.com/;
proxy_set_header Host b.example.com;
proxy_set_header X-Real-IP $remote_addr;
# 关键：重写响应头，避免子页 JS 检测到非原始域名
proxy_hide_header X-Frame-Options;
proxy_hide_header Content-Security-Policy;
}
然后父页 iframe src 改为 /proxy-b/xxx.html —— 此时浏览器认为它是同源资源，contentDocument 可直接访问。
别踩这些坑
容易被忽略但高频出问题的地方：
-
postMessage发送对象前没JSON.stringify？不用，它自动序列化，但函数、DOM 节点等无法传递 - 子页监听
message时没加if (event.source !== iframe.contentWindow)校验来源窗口？可能收到来自其他 tab 的干扰消息 - 用
window.name传数据？它已被现代浏览器限制为仅限同源页面间有效，跨域写入后读不到 - 以为
location.hash能绕过限制？它只能传字符串，且需子页主动轮询或监听hashchange，不适合实时交互
真正要落地，postMessage 是唯一兼顾兼容性、安全性与标准性的选择；其它方案要么退化为运维层面妥协（如代理），要么已进历史档案（如 document.domain）。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
