将 iframe 设置为远程内容的内容高度
Posted
技术标签:
【中文标题】将 iframe 设置为远程内容的内容高度【英文标题】:Set iframe to height of content for remote content 【发布时间】:2010-10-02 18:33:55 【问题描述】:论坛已经回答了如何使 iframe 适合 100% 的内容(使用 javascript)的问题......仅适用于显示来自同一域的内容的 iframe。 p>
我的问题:当 iframe src 属性用于包含框架的页面域之外的页面时,是否可以调整 iframe 的大小以适应内容?围绕跨站点脚本的浏览器安全功能阻止我访问 iframe 的文档对象。
我正在寻找任何有创意的解决方案。我的一个想法是以某种方式检测到 iframe 上的滚动条可见,并逐渐增加高度直到它们不可见。不幸的是,我也找不到任何检测可见滚动条的方法。想法?
请注意,我正在寻找客户端解决方案。
回复:
戴夫
问题仍然存在——我不提前知道远程文档的高度,所以我无法从数据库或查询字符串值中设置它。
杜软
CSS 中 iframe 上的 100% 不会将其设置为 iframe inside 内容的 100%,而是相对于页面或包含元素(即 div 或其他内容)。
【问题讨论】:
【参考方案1】:听起来您正在尝试解决一个有充分理由实施的安全功能......
调整大小是否必须通过脚本?您可以重定向到 iframe 大小取自查询字符串、数据库或配置文件等的页面。
【讨论】:
【参考方案2】:当 iframe src 属性用于包含框架的页面域之外的页面时,是否可以调整 iframe 的大小以适应内容?
可以绕过跨站点限制并将 iframe 设置为其内容的高度,但让它工作起来可能有点尴尬。
该解决方案涉及通过让 iframe 内容本身 iframe 与父页面位于同一服务器上的页面来解决安全模型,并且它可以与之通信。在here 之前,我已经回答了一个与此类似的问题,其中详细介绍了设置它的来龙去脉。
对所描述方法的警告是,您必须有方法将 iframe 内容获取到自身 iframe 父服务器上的页面。当 iframed 内容作为网站之间商定的合作伙伴关系的一部分存在时,这通常是可以实现的,但 YMMV。
【讨论】:
【参考方案3】:这是理论上的,因为我没有测试过:
1) php 将远程页面保存到一个 本地 html 文件使用
file_get_content()
或使用 CURL。 2)Javascript将本地文件加载到 框架 - 它现在是本地的,安全问题不适用。
如果有 javascript vars 或 Session vars(无法从远程内容中提取),您至少可以使用此技术来查询本地文件的文档高度,相应地设置 iframe,然后将远程 URL 加载到调整大小的iframe。
Cavat:您无法知道远程页面中页面更改的 URL,因此您只能在第一页上使用此技术。如果远程页面的高度都相同,这没问题。
【讨论】:
【参考方案4】:(我对a similar question的回答)
由于浏览器的安全模型,如果不对正在 iframe 的页面进行一些控制,则不可能执行此操作。如果可能,那将是一个安全问题,必须加以修复。
虽然在嵌入页面时让嵌入站点知道第三方网页的高度似乎无害,但这可能会将浏览器用户想要保密的信息泄露给嵌入站点。例如,http://www.facebook.com/ 根据您是否登录而呈现不同,因此如果我的网站可以计算出<iframe src="http://www.facebook.com/">
的高度,那么我可以计算出您是否是 facebook 用户,而您可能不会不想让我知道。
信息泄露类似于臭名昭著的CSS History Leak,浏览器供应商必须插入。
【讨论】:
【参考方案5】:不是最好的解决方案,但您可以尝试:
javascript 编写 iframe,在 iframe 应用程序中设置 url #h700 中的当前高度为 700px 等;然后使用循环在主机站点“在 javascript”中侦听该更改以读取 src="url#h700" 并以此设置 iframe 的高度。
【讨论】:
以上是关于将 iframe 设置为远程内容的内容高度的主要内容,如果未能解决你的问题,请参考以下文章