iframe父、子跨域传值和取值

1. 子页面传值-父页面取值响应

在主页面中点击iframe页面（子页面）时，子页面监听message事件并做出响应，返回参数给父页面，父页面做出响应。子页面的点击事件，代码如下：

function toIMWEBIndexPage() {
    window.top.postMessage({code:200},'*');
}

主页面接收code响应事件，代码如下：

window.addEventListener('message',self.iframeEventHandler,false);
iframeEventHandler(event) {
      let self = this;
      let resp = event.data;
      if (resp.code !== undefined) {
          // iframe 定义的code  进行事件分发
          switch (resp.code) {
            case 100:
              // 未登录状态，隐藏vue列表 
              self.oaIsVisable = false;
              break;
            case 200:
              // 点击iframe列表 ，隐藏vue列表 
              self.oaIsVisable = false;
              // self.$router.push({
              //   name: "im_web_chat"
              // });
              break;
            case 300:
              // 登录状态 ，显示vue列表 
              self.oaIsVisable = true;
              break;
            default:
              self.oaIsVisable = false;
              break;
          }
      }
    }

2. 父页面传值-子页面取值响应

在主页面中点击主页面的事件，子页面做出响应，主页面代码如下：

var iframe = document.getElementById("show-iframe");
if(iframe){
    iframe.contentWindow.postMessage({code:201}, '*');
};

子页面监听message事件并做出响应，代码如下：

window.addEventListener("message",function(obj){
     let resp = obj.data;
     switch (resp.code) {
         case 201: 
             break;
         default:
             break;
     }
},false);