window.open 不同源页面通信 传递数据

个人网站
https://kuangyx.cn
步骤:

1. 父页面打开子页面
2. 子页面发送消息给父页面通知页面加载完成
3. 父页面收到子页面加载完成后发送数据给子页面

代码示例:
父页面

const targetWindow = window.open("子页面地址", "_black");
window.addEventListener("message", e => {
  if (e.origin == "子页面地址") {
    console.log(e.data, "子页面发送来的数据");
    targetWindow.postMessage("发给子页面的数据", "*");
  }
});

子页面

window.addEventListener('message',e => {
  console.log(e.data,'父页面发送来的数据');
})
window.addEventListener('load',() =>{
  window.opener.postMessage('子页面加载完成');
})