Javascript 从跨域iframe窗口获取html

我的索引文件中有一个iframe，我希望从iframe中获取所有html并将其存储在一个变量中。iframe中加载的内容来自另一个域。因此，我尝试使用javascript、postMessage和eventListener来实现这一点。这是到目前为止我的代码。我有一个按钮，它调用click方法

index.vue

    click() {
        let iframe = document.getElementById('the_iframe');
        iframe.contentWindow.postMessage('Dont really know what to send here', '*');
        this.test();
    },
    test() {
        window.addEventListener('message', function(event) {
            //Just a test, as the it wont go in the else
            console.log(event.currentTarget.document);
            if (event.origin !== 'http://testdomain') {
                console.log('ERROR');
            } else {
                console.log(event.currentTarget.document);
                const html = event.currentTarget.document); 
                //This however doesnt work. The value is not stored in the const
                console.log(event.currentTarget.document);
            }
        });
    }

---

当我控制台记录event.currentTarget.document时，它会打印出站点的整个html结构，包括父页面（索引）。我的问题是：如何获取索引文件中iframe的所有html？如何将其存储在变量中

窗口。addEventListener（'message'），代码需要出现在父文档中

它需要自动运行。它不应该在函数中

（您可以将其放入函数中，但它仍然需要首先运行，在这种情况下没有理由这样做）

---

对

postMessage

的调用需要是框架内文档中的in脚本，并且需要将您想要的数据发布到父级

e、 g

---

现在，如果您想触发对HTML的获取以响应单击事件，那么两个文档都需要

窗口。addEventListener（'message'，

和

postMessage

调用：

父窗口有一个消息侦听器，用于侦听包含HTML的消息

父窗口有一个单击事件处理程序，它调用

iframe.contentWindow.postMessage

，并请求HTML

Iframe文档有一个消息侦听器，它侦听带有HTML请求的消息，然后调用

window.parent.postMessage（{HTML:document.body.innerHTML}，'*'）；

---

窗口。addEventListener（'message'），

代码需要出现在父文档中

它需要自动运行。它不应该在函数中

（您可以将其放入函数中，但它仍然需要首先运行，在这种情况下没有理由这样做）

---

对

postMessage

的调用需要是框架内文档中的in脚本，并且需要将您想要的数据发布到父级

e、 g

---

现在，如果您想触发对HTML的获取以响应单击事件，那么两个文档都需要

窗口。addEventListener（'message'，

和

postMessage

调用：

父窗口有一个消息侦听器，用于侦听包含HTML的消息

父窗口有一个单击事件处理程序，它调用

iframe.contentWindow.postMessage

，并请求HTML

Iframe文档有一个消息侦听器，它侦听带有HTML请求的消息，然后调用

window.parent.postMessage（{HTML:document.body.innerHTML}，'*'）；

---

可能重复：可能重复：Event.data正在打印[Object Object]。当我尝试解析时，我没有定义？我如何打印它？@Jonathan-它是一个对象。不要将它转换为字符串。使用

console.log

检查它的结构。我尝试过了。它当时显示[Object Object]。这是代码。index.vue:click（）{let iframe=document.getElementById（'iframe'）；iframe.contentWindow.postMessage（'html'，'*'）；}，Event.data正在打印出[Object]。当我尝试解析时，我没有定义？如何打印它？@Jonathan-它是一个对象。不要将它转换为字符串。使用

console.log

检查它的结构。我试过了。那是当它说[object object]时。这是代码。index.vue:click（）{let iframe=document.getElementById（'iframe'））；iframe.contentWindow.postMessage（'html'，'*'）；}，

window.parent.postMessage({ html: document.body.innerHTML }, '*');