iframe实现跨域父子通信（以子页面向父页面发送消息为例）

参考内容：

window.postMessage - Web API 接口参考 | MDN (mozilla.org)

有时候在实际开发中使用iframe时，我们会希望iframe可以实现跨域父子通信，使子页面能控制父页面的一些操作。

一般可以在子页面使用：

window.parent.postMessage("xxx", targetUrl, [transfer])

xxx是子页面向父页面发送的消息内容，如果有多个跨域需求的时候，可以通过发送消息的内容来区分是哪一个功能。

targetUrl设置成 “*”，可以允许往任意页面发送通信消息

[transfer]是可选参数，是一串和 message 同时传递的 transferable 对象。这些对象的所有权将被转移给消息的接收方，而发送一方将不再保有所有权（一般没有这个参数也没关系）

在父页面使用

window.addEventListener("message", function(e){

        .... //需要父页面进行的操作

}, false);

其中可能会需要在父页面该方法中使用if(e.origin=="...")来确认消息来源是否是我们想要的来源