99免费精品,午夜a级理论片在线播放一级,99精品在免费线视频,欧美精彩狠狠色丁香婷婷,中文字幕视频一区,中文字幕第5页,a毛片全部播放免费视频完整18

跨域通信方式
日期:2024年10月09日     新聞分類(lèi): 技術(shù)中心      瀏覽:283次

平時(shí)工作中會(huì )遇到頁(yè)面嵌套的情況,一般是用 解決。父子頁(yè)面跨域的情況可以通過(guò)postMessage來(lái)實(shí)現通信。

otherWindow.postMessage(message, targetOrigin, [transfer])

其中:

1.otherWindow:目標窗口。比如 的 contentWindow 屬性

2.message:將要發(fā)送到其他 窗口 的數據。

3.targetOrigin:目標窗口的域。其值可以是字符串"*"(表示無(wú)限制)或者一個(gè) URI。不提供確切的 targetOrigin 將導致數據泄露到任何對數據感興趣的惡意站點(diǎn)。

4.transfer:可選參數,高級用法。和message 同時(shí)傳遞的 Transferable 對象. 這些對象的所有權將被轉移給消息的接收方,而發(fā)送一方將不再保有所有權。

現在有兩個(gè)不同源的 嵌套頁(yè)面,父頁(yè)面 http://127.0.0.1:8001/parent.html,子頁(yè)面 http://127.0.0.1:8002/child.html,其中父頁(yè)面嵌套部分代碼如下:

< id="" src="http://127.0.0.1:8002/child.html"></>

1.父頁(yè)面發(fā)送信息,子頁(yè)面接收信息

// 父頁(yè)面發(fā)送信息

const = document.getElementById('');

. = function () {

.contentWindow.postMessage('hello, child!', 'http://127.0.0.1:8002');

}

// 子頁(yè)面接收信息

window.addEventListener('message', e => {

// 通過(guò)origin對消息進(jìn)行過(guò)濾,避免遭到XSS攻擊

if (e.origin === 'http://127.0.0.1:8001') {

console.log(e.origin) // 父頁(yè)面所在的域 

console.log(e.data) // 父頁(yè)面發(fā)送的消息, hello, child!

}

}, false);

2.子頁(yè)面發(fā)送信息,父頁(yè)面接收信息

// 子頁(yè)面

window.parent.postMessage('hello, parent!', 'http://127.0.0.1:8001');

// 父頁(yè)面

window.addEventListener('message', e => {

// 通過(guò)origin對消息進(jìn)行過(guò)濾,避免遭到XSS攻擊

if (e.origin === 'http://127.0.0.1:8002') {

console.log(e.origin) // 子頁(yè)面所在的域

console.log(e.data)  // 子頁(yè)面發(fā)送的消息, hello, parent!

}

}, false);

通過(guò)postMessage和window.addEventListener('message', e => { ... })配合使用,我們就能夠完成跨域 父子頁(yè)面的通信。當然對于同源的 父子頁(yè)面也可以采用postMessage的方式來(lái)發(fā)送接收信息。

版權所有: 山西科達自控股份有限公司 備案號:晉ICP備09004627號-2   

郵箱

keda@sxkeda.com

電話(huà)

400-0351-150

微信

專(zhuān)屬
客服

留言

右側導航