07/11
2016
我们可以使用HTML5的postMessage()方法进行跨文档的消息传递，不会触发跨域问题。
例如，我们可以在父窗口中向iframe里的页面或通过window.open()打开的页面发送消息（不仅限于文本数据），这两个页面不必是同源的（跨域可以，不跨域也可以）都不会触发跨域问题。
例如我在当前页面加载了下面的iframe页面：
<iframe src="http://127.0.0.1/t/index.html" id="f1"></iframe>
我们想要向它发送消息，该怎么做呢？
想要实现通信，首先得在接收页面里添加对消息的处理功能。postMessage()发送到页面时会触发message事件，我们在子页面绑定这个事件：
window.addEventListener("message",function(event){
if (event.origin == "http://www.saber.love"){//确保发送消息的域是已知的域
alert(event.origin+"说:"+event.data);//处理接收到的数据
// event.source.postMessage("Received!", "http://www.saber.love");//可选：向来源窗口发送回执
}
},false);
这样当消息发送到子页面时，子页面就能够处理了。
当触发message事件时，有一些有用的信息：
event.origin：发送消息的文档所在的域；
event.data：postMessage()发送过来的消息；
event.source：发送消息的文档的window 对象的代理。
之后我们在父页面向子页面发送消息，代码如下：
var iframeWindow = document.getElementById("f1").contentWindow;
iframeWindow.postMessage("hello~", "http://127.0.0.1"); //第二个参数指定【接收方】必须是指定的域
子页面接收到消息后就会进行处理：
到这里一个简单的通信就完成了。
这个例子中的通信是单向的，如果要做成子页面也向父页面返回消息，那么父页面也得绑定message事件才行。
不过我有个疑惑，子窗口似乎不能主动用postMessage向父窗口发送消息。只能在接收消息后趁机发送吗？
