facebook-app：如何更改可调整大小的 iframe 应用程序的高度？答案

【问题标题】：facebook-app: how can i change the height of a resizeable iframe application?facebook-app：如何更改可调整大小的 iframe 应用程序的高度？
【发布时间】：2010-04-01 18:45:04
【问题描述】：

我创建了一个 facebook 应用程序并配置了以下内容：

IFrame 大小：可调整大小画布宽度：760px （不使用 fbml）

似乎无论我如何配置我的 html 页面，iframe 高度都是 800px。我的应用程序需要更多，我怎样才能将 facebook 应用程序的 iframe 配置为具有更大的高度？

谢谢！

【问题讨论】：

标签： facebook

【解决方案1】：

将 Canvas Size 选项设置为 Resizable Iframe 本身并不会使画布自动调整大小以符合您的内容。你还需要做几件事。查看Resizable IFrame wiki 页面了解完整说明。

你基本上必须创建一个称为“跨域接收器”的 HTML 页面（就像复制和粘贴他们的示例文件一样简单），然后在你所有的底部复制一个 Javascript 代码的 sn-p应用程序页面。加载内容后，Javascript 将执行 iframe 的大小调整。

自从我上次使用以来，wiki 页面已经改进，所以希望它相当简单。如果您在使其正常工作时遇到问题，请确保检查您是否已适当修改了 javascript sn-p，使其指向您的跨域接收器页面。

2011 年 1 月更新 - 一些 cmets 进来了，所以我想我会更新。我相信这个答案或多或少是正确的，尽管文档已经改变。 Facebook 已经放弃了 FBML，并更新了他们的 Javascript SDK。当前加载 Javascript SDK 的方法位于 main Javascript SDK page，底部是可用于调整画布大小的方法 FB.Canvas.setAutoResize() 和 FB.Canvas.setSize()。您仍然需要在应用程序的开发人员设置中将您的画布设置为可调整大小。看起来他们可能已经用新的 SDK 取代了对跨域文件的需求，但我自己还没有测试过。

【讨论】：

我不知道这是否仍然是正确的答案，因为我已转向 FBML。使用 FBML，我真的不必担心这些。
据我所知，我的答案或多或少是正确的。我将编辑帖子以链接到一些新文档。 @ufk - 切换到 FBML 的错误决定。 FBML 已被弃用，很快您将无法再将应用程序创建为 FBML。我预计他们将在 1-2 年内完全停止支持 FBML 应用程序。
感谢您的信息！移回 Canvas 并且 FB.Canvas.setAutoResize() 解决了问题

【解决方案2】：

我把这段代码放在了我的 HTML iFrame 内容文件的末尾，就在结束标记之前，现在它工作得很好。

<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
  FB.init({
    appId  : 'YOUR_APP_ID',
    status : true, // check login status
    cookie : true, // enable cookies to allow the server to access the session
    oauth  : true // enable OAuth 2.0
  });
  FB.Canvas.setAutoResize();
</script>

显然，将您的 APPID 放在那里... :)

【讨论】：

【解决方案3】：

FB.Canvas.setAutoGrow()

注意：此方法仅在 App Dashboard 中将 Canvas Height 设置为“Fixed at (800)px”时启用。

启动或停止一个计时器，该计时器每隔几毫秒就会增加您的 iframe 以适应内容。默认超时为 100 毫秒。

以前称为FB.Canvas.setAutoResize。

http://developers.facebook.com/docs/reference/javascript/FB.Canvas.setAutoGrow/

【讨论】：

【解决方案4】：

虽然 wiki 不再存在，但我发现了这个页面，我认为这可能是 Zombat 所说的。

http://apps.facebook.com/wzhu_public_resize/

【讨论】：

【解决方案5】：

Facebook 最近为画布宽度和高度引入了一种新的“流动”设置，从而使画布尺寸能够超过正常的 760 像素宽度http://developers.facebook.com/blog/post/538/（2011 年 8 月 12 日）。

更改设置：

1) 转到 Facebook 应用程序设置页面。

2) 选择高级。

3) 在 Canvas Settings 下，将 Canvas Width 设置为流体。这允许应用程序几乎占据屏幕的整个宽度。

高度也可以这样。

额外：有人猜测这是为了响应谷歌在游戏领域的努力http://tutorial-on.blogspot.com/2011/08/facebook-features-new-gaming-canvas-and.html

【讨论】：