【问题标题】:Cross Site Scripting Iframe Permission Denied issue跨站点脚本 iframe 权限被拒绝问题
【发布时间】:2013-02-09 06:11:37
【问题描述】:

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

Javascript

 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>

错误如下

对于“e”:

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

谷歌浏览器:TypeError:无法读取未定义的属性“documentElement”

Internet Explorer:TypeError: Permission denied

对于“ee”:

Mozilla Firefox:错误:访问属性“documentElement”的权限被拒绝

谷歌浏览器:TypeError:无法读取 null 的属性“documentElement”

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

我认为它无法以一般方式解决,因为它正在发生,因为域指向另一个域。所以有人会指导我解决它,而不使用 Javascript contentDocument.documentElementcontentWindow.document.documentElement 的这些属性来根据其内部内容动态调整 iframe 内容的大小。

谢谢

【问题讨论】:

  • 只是检查:这些是不同的域,还是同一个域中的不同子域?

标签: javascript html wordpress iframe cross-domain


【解决方案1】:

除了Christophe 的回答之外,我想指出(遗憾的是)postMessage 不适用于所有浏览器。

幸运的是,Josh Fraser 已经提供了 a backwards compatible version of 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');

请确保您正确阅读了文档,因为必须正确设置配置。

【讨论】:

  • 天啊。我又糊涂了。现在举起我的手
  • 不需要;此解决方案只是 Christophe 已发布的列表的补充(确保检查浏览器兼容性)。选择一个适合你的并使用它(这个 XD 版本对我有用,但我敢肯定那里有很多)。
  • +1 用于 url 技术。 @Soumya 有几种解决方法,如果您需要支持较旧的浏览器,最好使用已经解决的库。
  • 非常感谢你们。以为我还没有成功,但如果我愿意,我会告诉你的。
【解决方案2】:

正如你所说,这是一个跨域问题。

如果您对两个页面都有控制权,则可以使用 postMessage 在两个页面之间交换信息。

一些参考资料:

【讨论】:

  • 非常感谢。我经历了它,但不知如何实现它。
  • 我添加了更多参考资料,希望对您有所帮助。您也可以在 Google 上搜索“iframe resize postMessage”
  • 我得到了一些,但似乎是 HTML 5 内容。我不知道这是否会在 IE8 上运行
  • @Soumya 添加了应该处理旧版 IE 的库列表
  • @Christophe:如果我无法控制 iframe 内容(从另一个域加载),我该如何修改它的 HTML?
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2014-06-18
  • 2015-11-15
  • 1970-01-01
  • 2015-01-28
  • 2015-05-24
  • 2021-08-30
  • 2014-10-22
相关资源
最近更新 更多