使用event.source.window.postMessage发送回发送方。

从Iframe

window.top.postMessage('I am Iframe', '*')
window.onmessage = (event) => {
    if (event.data === 'GOT_YOU_IFRAME') {
        console.log('Parent received successfully.')
    }
}

然后从父母那里说回来。

window.onmessage = (event) => {
    event.source.window.postMessage('GOT_YOU_IFRAME', '*')
}

窗外。顶级物业应该能满足你的需要。

如。

alert(top.location.href)

看到 http://cross-browser.com/talk/inter-frame_comm.html

你也可以使用

postMessage消息(,' * ');

在花了2天时间试图获得一个iFrame发布消息回父，一个Vue应用程序在我的情况下，我遇到了这个优秀的参考:

https://dev-bay.com/iframe-and-parent-window-postmessage-communication/

从iframe到parent:

    const parentWindow = window.parent;
    class Message {
        constructor(type, body) {
          this.type = type;
          this.body = body;
        }
    };

    function sendMessage (windowObj, payload) {
        if(windowObj) {
          windowObj.postMessage(payload, "*");
        }
    };

    //Then call appropriately: 
    sendMessage(parentWindow, new Message("button-click", "Show Stats Overlay"));

在父文件中，我的Vue应用程序挂载了生命周期事件，但请参考您自己的需求链接:

    window.addEventListener("message", (e) => {
        var data = e.data;
        console.log("RECEIVED message from CHILD TO PARENT", data);
        
        var type = data.type;
        var body = data.body;

        if(type === "button-click" && body) {
          console.log("button-click RECEIVED FROM CHILD")
          //Additional functionality ...
        } else if (type === "text-msg" && body) {
          console.log("TEXT MESSAGE RECEIVED FROM CHILD");
          //Additional functionality ...
        }
      });

请参阅从父节点到iFrame的通信示例。

希望这能帮助到其他人。

使用event.source.window.postMessage发送回发送方。

从Iframe

window.top.postMessage('I am Iframe', '*')
window.onmessage = (event) => {
    if (event.data === 'GOT_YOU_IFRAME') {
        console.log('Parent received successfully.')
    }
}

然后从父母那里说回来。

window.onmessage = (event) => {
    event.source.window.postMessage('GOT_YOU_IFRAME', '*')
}

对于不同的域，不可能直接调用方法或访问iframe的内容文档。

您必须使用跨文档消息传递。

Parent -> iframe

例如在顶部窗口:

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

在iframe中:

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

Iframe ->父级

例如在顶部窗口:

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

在iframe中:

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