Question

怎么使用postMessage进行通信

Answer 1

postMessage是window的方法，可以通过这个方法实现两个窗口之间的通信，总结下俩大概有两种类型

1.两个页面之间发送信息

2.页面向页面中的iframe发送信息

通过上边两个简单的例子可知，进行这种通信只需要简单的两个方法

第一步：分发消息，及把消息发送给相应的窗口
otherWindow.postMessage(message, targetOrigin, transfer);
otherWindow ：你要发送消息给哪个窗口就是哪个窗口的引用，注意不是当前窗口，可以是iframe的窗口对象，或者是window.open返回的窗口对象。如果获取不到otherWindow是没法对相应的窗口发送信息的。
message ：将要发送给otherWindow的数据。
targetOrigin ：指定哪些窗口可以获取到发送的数据（可以使用“*”表示无限制）。
transfer ：是一串和message 同时传递的Transferable对象，可选。

第二步：监听message事件，获取另一个窗口发送给当前窗口的信息
window.addEventListener('message', function, useCapture);
message ：事件类型。
function : 'message'事件发生时调用的函数。
useCapture ：布尔值，使用事件冒泡还是事件捕获，可选。

通过上面接单的两步就可以实现一个简单的通信