尝试从 iframe 内部向其父级调用 js 函数的跨域问题

Question

大家好，我在跨域方面遇到了问题。

我有 1 台服务器 （example.com），其中有：

index.html作为主页，indexIFrame.html作为索引内的框架.xhtml

Index.html 从静态服务器加载大量 javascript 文件（例如 staticServer：8090/myScript.js）

同时索引IFrame.html从另一个静态服务器加载它自己的javascript文件（otherServer：8070/myOtherScript.js）

所以在myOtherScript中.js我正在这样做：

parent.MyMainClass.showPopup();

MyMainClass 类在 staticServer 的 js 文件中声明（此文件可用于索引.xhtml）

当我运行代码时，我得到：

Unsafe JavaScript attempt to access frame with URL http://example:8080/myapp/myList.xhtml from frame with URL http://example:8080/myapp/myListIFrame.xhtml Domains, protocols and ports must match.

myList 和 myListIframe 它们位于同一服务器中，只是 javascript 资源位于不同的域中。

所以我不确定如何做到这一点。有什么想法吗？

Answer 1

现代浏览器根本不允许这样做。 首选技术是改用 https://developer.mozilla.org/en-US/docs/DOM/window.postMessage。

。但是你会发现，像往常一样，IE在它自己的小世界里，不支持这个标准。 我知道有一些框架提供了跨浏览器解决方案，但我不能特别推荐其中任何一个。

下面是一个跨浏览器侦听器：

if (typeof(window.postMessage) != 'undefined') {
    if (typeof(window.addEventListener) != 'undefined') {
        window.addEventListener("message", function(event) {
            doSomething(event.data);
        }, false);
    } else {
        window.attachEvent('onmessage', function(e) {
            doSomething(e.data);
        });
    }
}​

。和发件人...

if (typeof(window.postMessage) != 'undefined') {
    //modern browsers...
    window.top.postMessage('my data', '*');
} else {
    //older browsers - just access window.top
}

Answer 2

尝试在服务器上创建一些别名。

例如：http://example:8080/myapp/myScript.js会导致staticServer:8090/myScript.js等等。

这可能会愚弄javascript，因为它应该认为这些JS文件真的在你的服务器上。