如何在 iframe facebook 应用程序中使用 FB.Connect.streamPublish？答案

【问题标题】：How do I use FB.Connect.streamPublish in an iframe facebook app?如何在 iframe facebook 应用程序中使用 FB.Connect.streamPublish？
【发布时间】：2010-01-11 22:27:55
【问题描述】：

我正在制作一个简单的基于 iframe 的 Facebook 应用。我有以下代码来调整 iframe 的大小：

FB_RequireFeatures(["Connect"], function(){
  FB.XdComm.Server.init('/xd_receiver.htm');
  FB.CanvasClient.startTimerToSizeToContent();
  FB.CanvasClient.syncUrl();
});

我想添加一个链接，该链接将显示一个弹出窗口，允许用户将应用定义的图像/链接发布到用户的墙上。为了让事情开始工作，我尝试在点击事件上使用以下代码：

FB.Connect.streamPublish('');

但是，什么也没有发生。我试过添加：

FB.init(<?=API_KEY?>, '/xd_receiver.htm');

在 FB_RequireFeatures 函数中，在它之前，在它之后......都没有运气。什么都没发生。没有错误被抛出。没有。有什么想法吗？

【问题讨论】：

只是一个提示，如果你是第一次尝试制作一个简单的应用程序，那么制作一个 FBML 应用程序要比 iFrame 容易得多

标签： facebook iframe publish connect

【解决方案1】：

查看此页面以获取有关使用 Connect 使用 iFrame 应用设置 Stream 发布的完整说明：

http://thetechnicalexperience.blogspot.com/2010/02/how-to-use-fbconnectstreampublish.html

【讨论】：

【解决方案2】：

检查你是否有：（一些来自http://wiki.developers.facebook.com/index.php/Connect/Setting_Up_Your_Site#Referencing_Facebook_Connect_on_Your_Site）

已创建 xd_receiver.htm，并且它位于您域的根目录中
在文档的BODY顶部包含FeatureLoader.js.php
在文档底部添加了问题中的 javascript（例如 FB_RequiresFeatures 等）

我的应用中当前运行良好的代码示例：

<script type="text/javascript">
   window.onload = function() {
        FB_RequireFeatures(["XFBML", "Connect"], function() {
           FB.Facebook.init("...my api key...","xd_receiver.htm");
           FB.CanvasClient.syncUrl();
        });
   };
</script>

您可以在 FB_RequireFeatures 调用中省略“XFBML”，并将路径也更改为 xd_receiver.htm，它应该可以正常工作。

此外，请仔细检查应用程序的连接 URL（通过 Facebook 中的开发者应用程序设置）指向 xd_receiver.htm 文件的父级。因此，如果您的应用托管在 http://www.mydomain.com 上，那么查看您的代码示例，您的 xd_receiver.htm 将位于 http://www.mydomain.com/xd_receiver.htm，并且您希望将 http://www.mydomain.com 作为连接 URL。

如果这仍然不起作用，请尝试安装Firebug（或类似工具）以查看网络流量。当我让它工作时，Facebook Javascript API 会默默地失败，只有通过检查来回的请求，我才发现 Facebook 不喜欢我的 Connect URL。

为了测试它是否正常工作，我很想使用

FB.Connect.streamPublish();

而不是您发布的行，因为它应该弹出一个对话框，并且清楚地作为一个工作示例给出。我不确定如果你只是传递一个空字符串作为参数会发生什么。

最后，市面上有很多基于 IFrame 的 Facebook 应用程序 - 如果您发现其中一个正在做您喜欢的事情，您可以随时查看他们的 Javascript 以了解他们是如何实现的。或者换句话说，Facebook 充满了示例 IFrame 应用程序代码。

【讨论】：

我根据需要包含了“xd_receiver.htm”。我没有设置连接 URL，因为如果我设置它，每次我进入应用程序时，它都会在新窗口中加载实际 URL，而不是在 facebook 中的 Canvas 中加载。我安装了 Firebug ......我试过做 console.log(FB.Connect.streamPublish());它打印出“真实”。我已经尝试过 ('') 和 ()，并且我在 dev wiki 上看到了这两个示例......两者都没有。我查看了 firebug 中的响应，但它对我的 Connect URL 不满意（因为未设置）。但是，如果我设置了一个，那么转到该应用程序会使我离开现场。
如果不设置连接 URL，您将无法使用 FB javascript 客户端。当新窗口弹出时，streamPublish 工作吗？如果是这样，您需要做的就是解决“新窗口”问题，一切都会按要求工作。回顾您在问题中包含的内容，我认为我们还没有足够的能力来弄清楚您为什么要获得一个新窗口。你使用的是什么浏览器？您能否提供更多返回的 HTML，或者您有一个我们可以访问以查看应用运行的 URL 吗？
我的意思是，如果我设置了 Connect URL，访问应用程序会导致 Facebook 加载 Connect URL（与我的应用程序的 URL 相同），而不是在 iframe 中加载数据在 Facebook 画布中。
当你说去应用程序时，我假设你的意思是去apps.facebook.com/myapp？您应该有一个引用您自己的服务器的 Canvas 回调 URL，例如mydomain.com，也可以是您的连接 URL。事实上，我的应用程序对两者使用相同的 URL，这可能很常见。我很好奇你是如何导航到你的应用程序的——你是要去apps.facebook.com/yourapp，还是去应用程序本身（即mydomain.com）？如果您直接从自己的服务器请求应用程序，我可以理解它不会将您重定向到 Facebook 框架 URL。

【解决方案3】：

您必须设置连接 url 才能使用 javascript 库。尝试将您的书签 URL 设置为 http://apps.facebook.com/yourapp 看看是否有帮助。

【讨论】：

【解决方案4】：

@Cyphus

是的，当我说“访问应用程序”时，我的意思是访问 facebook 上的应用程序页面 (apps.facebook.com/myapp)。目前，我的回调 URL 仅设置为画布。一旦我尝试将回调 URL 用于画布和连接 URL，每当我尝试访问应用程序时，我都会被重定向到实际的回调 URL 本身，而不是在 facebook 中加载 iframe。我不直接从我的服务器请求它，因为这在某种程度上违背了拥有 facebook 应用程序的目的。

【讨论】：