postMessage解决跨域、消息传递（平台嵌入其他项目，需要相互发送接受消息）

使用背景：其他平台嵌入到自己项目平台上，使用iframe做嵌套，但是涉及到进来免登录以及跨域问题，使用postMessage发送信息。

想要使用 postMessage 实现跨域通信和页面间数据通信，只要记住 window 提供的 postMessage 方法和 message 事件。

1、发送消息：

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

otherWindow
其他窗口的一个引用。比如 iframe 的 contentWindow 属性、执行 window.open 返回的窗口对象、或者是命名过或数值索引的 window.frames。

message
要发送的消息。它将会被结构化克隆算法序列化，所以无需自己序列化，html5规范中提到该参数可以是JavaScript的任意基本类型或可复制的对象，然而并不是所有浏览器都做到了这点儿，部分浏览器只能处理字符串参数，所以我们在传递参数的时候需要使用JSON.stringify()方法对对象参数序列化。

targetOrigin
“目标域“。URI（包括：协议、主机地址、端口号）。若指定为”*“，则表示可以传递给任意窗口，指定为”/“，则表示和当前窗口的同源窗口。当为URI时，如果目标窗口的协议、主机地址或端口号这三者的任意一项不匹配 targetOrigin 提供的值，那么消息就不会发送。

2、接收消息
如果指定的源匹配的话，那么当调用 postMessage() 方法的时候，在目标窗口的Window对象上就会触发一个 message 事件。
获取postMessage传来的消息：为页面添加onmessage事件。

window.addEventListener('message',function(e) {
   
   var origin = event.origin;
   // 通常，onmessage()事件处理程序应当首先检测其中的origin属性，忽略来自未知源的消息
   if (origin !== "http://example.org:8080") return;
   // ...
}, false)

event 的属性有：

data: 从其他 window 传递过来的数据副本。
origin: 调用 postMessage 时，消息发送窗口的 origin。例如：“http://example.com:8080”。
source: 对发送消息的窗口对象的引用。可以使用此来在具有不同 origin 的两个窗口之间建立双向数据通信。

小demo参考下：
http://www.domain1.com/a.html

<iframe