Javascript中的跨文档消息传递是什么？有什么应用场景？

跨文档消息传递(Cross-document messaging)指的是不同域名下的网页彼此通信的方式。

在JavaScript中,可以使用postMessage()方法实现跨文档消息传递。postMessage()方法接收两个参数:

1. message:要发送的消息
2. targetOrigin:指定接收消息的窗口的源,可以是 URL 或 ‘*’ (表示任何源)

例如,a.html 发送消息给 b.html:
a.html:

window.opener.postMessage('Hello', 'http://b.com');

b.html:

window.addEventListener('message', function(e) {
  console.log(e.data); // 'Hello'
  console.log(e.origin); // http://a.com 
}, false);

跨文档消息传递有以下主要应用场景:

1. 父子窗口通信:用于打开的新窗口/iframe 与父窗口通信。
2. 跨域通信:两个不同域名的网页相互通信。因为同源政策的限制,一般不支持跨域通信,postMessage 提供了一种补充方案。
3. 页面模块通信:一个网站中的不同页面或模块之间通信,避免直接暴露全局变量。

postMessage 方法的特点:

1. 发送端不需要知道接收端 window 对象的引用,只需要知道接收端的源。
2. 消息通过异步方式发送,不会影响程序的当前执行过程。
3. 同源策略限制被绕过,可以实现跨域通信。
4. 增加了消息安全性,只有指定的来源才能接收消息事件。

可以看出,postMessage 是一种安全可靠的跨窗口通信方式,在 web 开发中有着广泛的应用场景。
它允许跨窗口和跨域(域名不同)的脚本进行通信,同时又能保证安全性,这为 web 开发带来了极大的便利。有了它,我们可以打通ного稍微复杂的 web 项目中的不同模块,实现更加完美的用户体验。