postMessage 使用

`postMessage` 方法可以用于在不同的窗口或 iframe 之间进行安全的跨域通信。它能够向指定窗口发送一个消息，并且在接收窗口中设置一个监听器来接收该消息。

`postMessage` 方法的基本语法如下：

otherWindow.postMessage(message, targetOrigin, [transfer]);

其中，`otherWindow` 表示指定的窗口或 iframe，`message` 表示要发送的消息，`targetOrigin` 表示接收消息的窗口的源（如果不指定，表示不限制源），`transfer` 表示要传递的数据（可选）。

例如，下面的代码可以向指定的窗口发送一个消息：

var otherWindow = window.open('http://example.com/');
otherWindow.postMessage('Hello, world!', 'http://example.com');

在上面的代码中，我们首先使用 `window.open` 方法打开了一个新的窗口，并将其引用赋值给了 `otherWindow` 变量。然后，我们使用 `postMessage` 方法向该窗口发送了一个消息。由于指定的源为 `http://example.com`，因此只有来自 `http://example.com` 源的窗口才能接收到该消息。

接收窗口可以使用以下代码来监听消息：

window.addEventListener('message', function(event) {
  if (event.origin !== 'http://example.com') {
    return;
  }
  console.log(event.data);
});

在上面的代码中，我们使用 `addEventListener` 方法向当前窗口添加了一个监听器，用于监听 `message` 事件。当接收到事件时，我们首先检查消息的源是否为 `http://example.com`，如果不是，则直接返回。否则，我们就可以使用 `event.data` 属性来获取消息内容，并进行相应的处理。

需要注意的是，`postMessage` 方法虽然可以进行跨域通信，但也存在一定的安全风险。因此，在使用时需要仔细考虑安全问题，并避免发生跨站点脚本（XSS）攻击等问题。