iframe和父级窗口通信

1：目前需求需要在页面中嵌入一个外部页面，同时页面实现跨域通信。

1:思路是利用postMessage来实现交互。
2:使用window.addEventLister去接收消息
3:利用iframe的window去发送消息，（但是这里获取iframe的window时 会存在跨域的问题，所以采用了nginx代理，本来是解决跨域，却报跨域错误，后来又莫名其妙的好了，对了，我把sonarlint给关掉了，不知道和这个是否有关系，但是的确很奇怪。同时我又去了解了一个document.domain.可以用来解决相同域名不同端口之间的跨域，和有公共上级域名的情况）
可以参考：
https://blog.csdn.net/huzhenv5/article/details/104884760
4:otherWindow.postMessage(message, targetOrigin);
targetOrigin:指定哪些窗口能接收到消息事件，其值可以是 *（表示无限制）或者一个 URI。

2：代码实现（Vue）

nginx配置中
location /balabala/ {
  proxy_pass https://www.jianshu.com/
}

<iframe ref="iframe"></iframe>
  //接收消息
window.addEventListener('message',getMessage);
  const getMessage=(e:MessageEvent)=>{
  console.log(e);
}
//发送消息
const iframe = ref(null);
iframe.contentWindow.postMessage({code:'submit'},location.href);

3：问题分析

1:unexpected token o in JSON at position 1
出现这个问题的原因是刚开始没有使用代理，无法获取到iframe的content.window