iframe+postMessage跨域通信

场景：（单点登录）从应用平台登录成功后，点击系统图标跳转到对应系统的首页
实现方式：在A系统写入iframe，应用平台点击按钮后跳转A体统（window.open），加载A系统的代码，当A体统中的iframe.onload加载完毕后，通知平台已经加载完毕(ifram.content.postMessage),可以给我发送token了，对应平台应该添加一个监听事件接收ifram发送来的消息，(widown.addEventListioner),并且平台拿到消息后将token发送给ifame，对应iframe也应该有一个监听事件来接收平台发送的token，并保存到本地的cookie中，此时iframe所在的A系统就拿到了平台的token了，A系统拿着token进入路由校验流程，
退出A系统的逻辑：当退出A体统后需要cookie中的token清除，将如果于平台还在开着状态，退出A系统重洗刷新网页就会又到A系统的首页，这是因为刷新A网页就重新加载ifram的onload事件，重复上面的操作，获取token造成退出不了的情况，所以在退出时候要将平台的对应A系统的token清除掉这样就拿不到token了就可以退出了，清除平台token需要在平台的监听事件中清除token，同时在A系统的ifram中要向平台发送清除token的消息

平台.vue

<el-card class="left&#

标签：postMessage,ifram,跨域,平台,系统,token,iframe,加载
来源： https://blog.csdn.net/qq_41742961/article/details/122512539