跨域 IFRAME 大小调整



我知道这个问题被问了很多,但是当我无法访问 IFRAME 显示的实际页面时,如何设置跨域 iframe 的动态高度?

你不能。无法从框架外部知道框架中文档的高度,因为有关文档的所有信息都受到第三方站点的保护。

如果您有权在父页面和 iframe 页面上添加 javascript,则可以将其添加到两者中:

document.domain = 'mydomain.com';

通过这种方式,您可以避免跨域限制,并且可以嗅出高度以更改父页面中的 iframe 高度

必须通过您自己的服务器代理页面(至少一次)

<?php
$homepage = file_get_contents('http://www.megaupload.com'); 
echo $homepage;
?>
<script>etc</script>

我也遇到了这个问题,但我终于得到了解决方案:

将此代码放在<head>中:

    <script type="text/javascript">
  function resizeCrossDomainIframe(id, other_domain) {
    var iframe = document.getElementById(id);
    window.addEventListener('message', function(event) {
      if (event.origin !== other_domain) return; // only accept messages from the specified domain
      if (isNaN(event.data)) return; // only accept something which can be parsed as a number
      var height = parseInt(event.data) + 0; // add some extra height to avoid scrollbar
      iframe.height = height + "px";
    }, false);
  };
</script>

然后,将以下代码用于 iframe:

<iframe src='http://www.example.com/my-iframe/' frameborder="0" id="my_iframe" onload="resizeCrossDomainIframe('my_iframe', 'http://www.example.com');">

相关内容

  • 没有找到相关文章

最新更新