页面内跨域解决方案

• 除了浏览器请求跨域之外，页面之间也会有跨域需求，例如使用 iframe 时父子页面之间进行通信。
  postMessage
• HTML5 推出了一个新的函数 postMessage() 用来实现父子页面之间通信，而且不论这两个页面是否同源。
• 举例来说，如果父页面 https://lagou.com 要向子页面 https://kaiwu.lagou.com 发消息，可以通过下面的代码实现。

// https://lagou.com

var child = window.open('https://kaiwu.lagou.com');

child.postMessage('hi', 'https://kaiwu.lagou.com');

在子页面中，只需要监听“message”事件即可得到父页面的数据

// https://kaiwu.lagou.com
window.addEventListener('message', function(e) {
  console.log(e.data);
},false);

同样的，父页面也可以监听“message”事件来接收子页面发送的数据。子页面发送数据时则要通过 window.opener 对象来调用 postMessage() 函数。

// https://kaiwu.lagou.com

window.opener.postMessage('hello', 'https://lagou.com');