window.postMessage()

該window.postMessage()方法可以安全地實現物件之間的跨域通訊Window；例如，在頁面和它生成的彈出視窗之間，或者在頁面和嵌入其中的 iframe 之間。

通常，當且僅當它們源自的頁面共享相同的協議、埠號和主機（也稱為“同源策略”）時，不同頁面上的指令碼才被允許相互訪問。 window.postMessage()提供了一種受控機制來安全地規避此限制（如果使用得當）。

廣義上講，一個視窗可以獲取對另一個視窗的引用（例如，通過 targetWindow = window.opener），然後 MessageEvent在其上使用排程一個targetWindow.postMessage()

語法：

postMessage(message, targetOrigin)
postMessage(message, targetOrigin, transfer)

簡單來說，message=訊息內容，targetOrigin=接收者，targetWindow=傳送者，transfer=相當於附件，跟message一起傳遞，傳遞過後自己不可再用

具體語法說明：https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage

第一步：確定傳送視窗（vue中內嵌iframe頁面）和接收視窗（vue頁面）

第二步：程式碼實現（簡單實現）

iframe：

1 <script>
2   window.parent.postMessage({
3     data: {} // 傳遞的資料
4 }, '*')
5 </script>

vue：

 1 mounted() {
 2     window.addEventListener('message', this.receiveMessage)
 3 },
 4 methods: {
 5     // 處理函式
 6     receiveMessage(event) {
 
 7         // 處理邏輯     
　　　　}
13 }

補充說明：更深層次用法，根據情況參考文件即可。記錄一個用法window.attachEvent，同樣起到事件監聽的作用，適用於ie瀏覽器；window.addEventListener()相容主流瀏覽器（火狐，谷歌等）；

window.attachEvent()用法可參考：https://www.jb51.net/article/66111.htm

參考文章：https://blog.csdn.net/jianjian_19/article/details/124129516

前端小白一枚，歡迎大家指正！