如何實作IFrame與其父網站之間的跨域通訊？

iFrame 與父站點之間的跨域通訊

當iframe 的網站駐留在不同網域時，iframe 與父站點之間可以直接通訊父網站成為一個挑戰。然而，跨文檔訊息傳遞可以彌補這一差距。

父級到Iframe 通訊

在父視窗中，您可以使用postMessage() 向iframe 的contentWindow:

myIframe.contentWindow.postMessage('hello', '*');

在ife端，onmessage事件可以捕獲並處理message:

window.onmessage = function(e) {
    if (e.data == 'hello') {
        alert('It works!');
    }
};

iframe 到父窗口的通訊

要將訊息從iframe 傳送到父窗口，可以將postMessage() 與window.top一起使用作為目標：

window.top.postMessage('hello', '*')

在父視窗中，onmessage 事件會接收並處理iframe 的message:

window.onmessage = function(e) {
    if (e.data == 'hello') {
        alert('It works!');
    }
};

透過利用跨文件訊息傳遞，您可以在來自不同域的iframe 與其父站點之間建立雙向通訊。

以上是如何實作IFrame與其父網站之間的跨域通訊？的詳細內容。更多資訊請關注PHP中文網其他相關文章！