gpt4 book ai didi

javascript - 简单的跨域 iframe postMessage 在 jsfiddle 中有效但在本地无效

转载 作者:行者123 更新时间:2023-11-30 00:34:27 24 4
gpt4 key购买 nike

我正在尝试使用另一个域上的 iframe,但我卡在了“Hello World!”阶段。

我有两个文件,通过两个静态服务器提供服务。我通过两个不同的域和不同的端口引用这些文件。

http://localhost:8080/index.html

<iframe id="target" src="http://hocallost:8081/iframe.html" frameborder="1"></iframe>

<script>
var target = document.getElementById('target');
target.contentWindow.postMessage('hello', '*');
</script>

http://hocallost:8081/iframe.html

<script>
window.addEventListener('message', function receiveMessage(message) {
console.log(message);
document.body.textContent = "Hello World!";
}, false);
</script>

现在,在本地,消息事件处理程序甚至没有触发。我没有消息,没有调用 console.log 并且我的断点没有中断。

当我将 index.html 的源代码粘贴到 JSFiddle 时,它起作用了!事件触发,我得到了 Hello World。

现在,我显然不能在我的生产应用程序上依赖 JSFiddle,我做错了什么?我在这里错过了什么? JSFiddle 是否在幕后做了一些我没有做的事情?

最佳答案

您似乎没有等待加载目标 iframe。

var target = document.getElementById('target');
target.onload = function(){
target.contentWindow.postMessage('hello', '*')
}

注意:在部署代码时,不要忘记将“*”替换为相关来源。

关于javascript - 简单的跨域 iframe postMessage 在 jsfiddle 中有效但在本地无效,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27798122/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com