前端iframe跨域傳值筆記

2022-01-11 02:39:50 字數 935 閱讀 3513

五、 postmessage跨域

postmessage是html5 xmlhttprequest level 2中的api,且是為數不多可以跨域操作的window屬性之一,它可用於解決以下方面的問題:

a.) 頁面和其開啟的新視窗的資料傳遞

b.) 多視窗之間訊息傳遞

c.) 頁面與巢狀的iframe訊息傳遞

d.) 上面三個場景的跨域資料傳遞

用法:postmessage(data,origin)方法接受兩個引數

data: html5規範支援任意基本型別或可複製的物件,但部分瀏覽器只支援字串,所以傳參時最好用json.stringify()序列化。

origin: 協議+主機+埠號,也可以設定為"*",表示可以傳遞給任意視窗,如果要指定和當前視窗同源的話設定為"/"。

// 向domain2傳送跨域資料iframe.contentwindow.postmessage(json.stringify(data), '');

};// 接受domain2返回資料window.addeventlistener('message', function(e) , false);

// 接收domain1的資料window.addeventlistener('message', function(e) 

}, false);

script>

iframe 跨域 父頁面向子頁面傳值

今天碰到乙個需求,是不同域的兩個頁面之間傳值 在網上找了一下,一般有兩個解決方案,乙個是建立乙個 頁面,通過 頁面傳值,另乙個方法是通過h5的postmessage方法傳值,今天用的是第二種。var iframe document.getelementbyid onemap var msg var ...

JS frame 跨域 傳值

1.在index.html 頁面定義乙個 函式用於接收 子頁面的呼叫。function refun data 2.在index2.html 頁面中 增加乙個的iframe 但是呼叫位址 需要與index.html 同乙個域 可以根據需要 動態建立iframe 靈活呼叫 這樣就可以在 index2.h...

jquery 跨域傳值

2個網域名稱,非常不同,網域名稱甲向網域名稱乙提交資料,網域名稱乙獲取資料返回處理資料後的結果。網域名稱甲頁面test.html,核心 sub btn bind click function function data 是鍵值對形式的物件,因為已經新增了form.attr action data c...