msg:要傳遞的資料，html5規範中提到該引數可以是j**ascript的任意基本型別或可複製的物件，但是並不是所有的瀏覽器都可以做到這點，部分瀏覽器只能處理字串引數，所以我們在傳遞引數的時候需要使用json.stringify()方法對物件引數序列化，在低版本ie中引用json2.js可以實現類似效果。
targetorigin：字串引數，指明目標視窗的源，協議+主機+埠號[+url]，url會被忽略，所以可以不寫，這個引數是為了安全考慮，postmessage()方法只會將message傳遞給指定視窗，當然如果願意也可以建引數設定為"*"，這樣可以傳遞給任意視窗，如果要指定和當前視窗同源的話設定為"/"。
當postmessage()被呼叫的時，乙個訊息事件就會被分發到目標視窗上。該介面有乙個message事件，該事件有幾個重要的屬性：
data：顧名思義，是傳遞來的message
source：傳送訊息的視窗物件
origin：傳送訊息視窗的源（協議+主機+埠號）
這樣就可以接收跨域的訊息了，我們還可以傳送訊息回去，方法類似。
簡單的demo
例：實現如下兩個不同域文件之間的通訊，
1.主頁面：
frame color
2.iframe頁面：
click to change color
增強postmessage通訊安全
對於包含重要資訊的訊息，不要砸targetorigin引數中使用「*」，而應當指定乙個域，否則，無法保證訊息只傳送到了期望的接收處；
經常檢查origin屬性，以確保只接收來自可信任的訊息域中的訊息；
想要更安全的話，可以檢查一下收到的資料是否符合預期的格式。
vue中使用postMessage進行跨越傳值
想在 當前位置 獲取子頁面的title屬性，但是main頁面和子頁面在不同的埠上，直接獲取會出現 blocked a frame with origin from accessing a cross origin frame 跨域問題 於是改用postmessage進行跨域訪問 子頁面中 mount...
Html5 postMessage實現跨域訊息傳遞
window.addeventlistener message function e onmessage事件接受乙個引數e,它是乙個event物件。e的幾個重要屬性 1 data postmessage傳遞過來的msg 2 傳送訊息的視窗物件 3 origin 傳送訊息視窗的源 協議 主機 埠號 來...
Html5 postMessage實現跨域訊息傳遞
一 同源策略 要理解跨域，我們首先要知道什麼是同源策略。百科上這樣定義同源策略 同源策略 same origin policy 是一種約定，它是瀏覽器最核心也最基本的安全功能，如果缺少了同源策略，則瀏覽器的正常功能可能都會受到影響。可以說web是構建在同源策略基礎之上的，瀏覽器只是針對同源策略的一種...