先说结论
document.domain 将变为可读属性。
we'll show a warning in the Issues panel starting from Chrome 100, removing
document.domainsetter by default starting from Chrome 106.
影响
在业务中通过修改 document.domain 来实现跨域的方案将不再有效，需要马上进行改造。
document.domain 如何实现跨域访问资源
- 前提是：两个域名的二级域名需要是相同的
域名级数是指一个域名由多少级组成，域名的各个级别被“.”分开，最右边的那个词称为顶级域名。
顶级域名，又称一级域名，常见的有".com"、".org"、".net"、".cn"等。
"二级域名"就是在一级域名前再加一级，如"baidu.com"。
二级域名以上级别的域名，统称为子域名，不在“注册域名”的范畴中。
什么是跨域？
我们通过了一些手段，可以绕过这个同源策略的限制，让非同源的资源也能互相访问，这就是跨域。
跨域是由于浏览器的同源策略的限制，限制不同源的域名之间的以下操作：
-
dom 无法获取
-
ajax 请求无法发送
-
cookie、Storage、IndexDB 无法访问
同源策略
同源指的是：协议、域名、端口号需要相同
document.domain 是如何实现跨域的呢？
document.domain
默认情况下，document.domain 存放的是载入文档的服务器的主机名，可以手动设置这个属性，设置该属性有两个特点：
- 只能设置成当前域名，或者当前域的二级域名（比如 document.domain 为
www.baidu.com，可以设置成baidu.com） - 任何对 document.domain 的赋值操作，包括 document.domain = document.domain 都会导致端口号被重写为 null
通过这两个特点，我们就可以实现二级域名相同的不同域之间的跨域 dom 访问（就算端口不同也可以）
假如我们有这样一个场景：
我们在一个页面 https://a.example.com 嵌入了一个 iframe 页面 https://b.example.com。它们的二级域名都是 example.com。
这时候，因为浏览器的同源策略限制，我们主页面和 iframe 肯定是无法通信的。
但是，当两个页面的 document.domain 都设置为 example.com 也就是二级域名的时候，浏览器就将两个来源视为同源。
这时候主页面就可以和 iframe 进行通信了（比如访问 iframe 的 document）。
另外，还有个场景，我们本地调试的时候可能经常会用到：相同域名、不同端口间的跨域。
比如，上面两个网页，在还没上线的时候，可能我们这时候要在本地调试功能，可能把它们部署在本地的不同端口上：
http://localhost:8888/http://localhost:6666/
默认情况下它俩肯定也是不能跨域通信的，这时候我们可以把它们的 document.domain 都设置为 localhost，就可以跨过端口不同的限制了。
为什么要禁用？？
不安全
二级域名一样的域名一定属于同一个业务吗？不一定吧～～
这时候，这种跨域的方式就可能被滥用了。
所以，Chrome 决定禁用它
替代方案
不慌，还有 postMessage。
主页面：https://a.example.com
// 给 https://b.example.com 发消息
iframe.postMessage("哈喽", "https://b.example.com");
// 接收信息
iframe.addEventListener("message", event => {
// 把不想要的信息过滤掉
if (event.origin !== "https://b.example.com") return;
if (event.data === "success") {
// 干点别的 ...
}
});
iframe： https://b.example.com
// 接收信息
window.addEventListener("message", event => {
// 拒绝掉乱七八糟的信息
if (event.origin !== "https://a.example.com") return;
// 恢复消息
event.source.postMessage("success", event.origin);
});
如果还是想用 document.domain 怎么办？
可能你的网站改造起来有点麻烦，或者你对 document.domain 情有独钟？
给你的网页增加下面这个 Header 就可以了：
Origin-Agent-Cluster: ?0
此时我们就可以继续使用 document.domain.
网友评论