javascript - 设置 Iframe 的高度等于其内容

Question

我已经为此苦苦挣扎了一整天，难以置信。我的网站上有一个选项，用户可以下载与某个用户的完整聊天历史记录，而不是在线加载，这样很可能会导致浏览器崩溃。无论如何，当他们请求下载历史记录时，就会创建一个 zip 存档，其中包含每天的历史文件 - 以防万一他们没有足够强大的机器来一次打开它们，以及一个包含所有历史文件的索引文件Iframe 的形式(而不是在 2 个地方写相同的内容)。

问题:我想做的就是将 Iframe 的高度设置为等于其内容的高度，令人惊讶的是，由于 Chrome 的同源政策，这在 Chrome 中似乎是不公平的不可能。我一开始以为我可以得到子 Iframe 的 body 滚动高度就可以了，但后来 SOP 说不，并打了我一巴掌。然后我想我可以从历史文件内部将 html 标签的 style.height 设置为其完整高度，然后检索它，但也失败了。

我真的开始失去希望了，有人可以帮助我吗？

Answer 1

在 iframe 内容的页面和调用 iframe 的页面中，输入:

<script>
    document.domain = 'http://yoursite.com'; (NOT www.)
</script>

还要确保调用 iframe 时不使用 www. ,

执行:<iframe onload = "setIframeHeight( this.id )" ...>

和iFrameHeight()就像:

<script>
   document.domain = 'http://yoursite.com';
    function setIframeHeight( iframeId )
    {
     var ifDoc, ifRef = document.getElementById( iframeId );
     try
     {   
      ifDoc = ifRef.contentWindow.document.documentElement;  
     }
     catch( e )
     { 
      try
      { 
       ifDoc = ifRef.contentDocument.documentElement;  
      }
      catch(ee)
      {   
      }  
     }
     if( ifDoc )
     {
      ifRef.height = 1;  
      ifRef.height = ifDoc.scrollHeight;  
     }
 </script>

我根本不确定这是否适合你，但对我来说它确实有效。