跨站点脚本iframe权限被拒绝的问题

Question

我在以下代码上遇到跨站点脚本错误。

Java脚本

 function resizeIframe(ifRef) 
            {
                var ifDoc;
                //alert(ifRef);

                try
                { 
                    ifDoc = ifRef.contentWindow.document.documentElement; 
                }
                catch( e )
                {
                   alert(e);
                    try
                    { 
                    ifDoc = ifRef.contentDocument.documentElement; 
                    }
                    catch( ee ){
                             alert(ee);
                          } 
                }
                //var doc = ifRef.height;
                //alert(doc);
                if(ifDoc)
                {
                    ifRef.height = 1; 
                    ifRef.style.height = ifDoc.scrollHeight+'px';               
                }
            }

iframe

<iframe onload="resizeIframe(this)" style="margin-bottom: 16px;" src="ourteamnav/first.php" frameborder="0" scrolling="no" width="597" height="240"></iframe>

错误如下

前面' ：

Mozilla Firefox： 错误：拒绝访问属性“文档”的权限

谷歌浏览器： TypeError：无法读取未定义的属性'documentElement'

Internet Explorer： TypeError：权限被拒绝

对于“ ee”：

Mozilla Firefox： 错误：拒绝访问属性'documentElement'的权限

Google Chrome： TypeError：无法读取null的属性“ documentElement”

Internet Explorer： 错误：访问被拒绝。

我认为由于域指向另一个域，因此无法以一般方式解决它。 因此，有人会指导我解决该问题，而无需使用Javascript contentDocument.documentElement或contentWindow.document.documentElement这些属性来根据其内部Content动态调整Iframe Content的大小。

谢谢

Answer 1

除了Christophe的答案外，我想指出（不幸的是） postMessage不适用于所有浏览器。

幸运的是， Josh Fraser已经提供了window.postMessage（）的向后兼容版本 。 它检查浏览器是否支持postMessage方法。 如果是这样，它将使用它。 如果不是，则使用URL （来自iframe和父级）传递数据。

现在，您可以使用以下方法让两个窗口彼此“交谈”：

XD.postMessage(msg, src, frames[0]);
XD.receiveMessage(function(message){
    window.alert(message.data + " received on "+window.location.host);
}, 'URL');

只需确保您正确阅读了文档，因为必须正确设置配置。

Answer 2

如您所说，这是一个跨域问题。

如果您可以同时控制两个页面，则可以使用postMessage在两个页面之间交换信息。

一些参考：

• Ben Alman调整iframe大小的示例
• John Resig在postMessaging上的文章
• 关于iframe的精彩演讲 （您感兴趣的内容从幻灯片16开始）。
• 包含此技术的库/插件的列表