如果您想使用 Meteor 构建完整的客户端应用程序,使用 Facebook JavaScript SDK 是一个不错的主意...
Alex C 的答案乍一看是有效的,但在“导航”并返回到定义 <div id="fb-root"></div> 的“页面”之后,我对 FB.logout() 有一些问题,因为当重新渲染 fb-root 时,FB .logout() 停止工作。
所以我认为加载 Facebook JavaScript SDK 的最佳方式是使用Template created callback:
Template.fbLogin.created = function () {
if (!Session.get("is Facebook JDK loaded?")) {
Session.set("is Facebook JDK loaded?", true);
// https://developers.facebook.com/docs/reference/javascript/
window.fbAsyncInit = function() {
// init the FB JS SDK
FB.init({
appId : '[YOUR_APP_ID]', // App ID
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
// Additional initialization code such as adding Event Listeners goes here
};
// Load the SDK's source Asynchronously
// Note that the debug version is being actively developed and might
// contain some type checks that are overly strict.
// Please report such bugs using the bugs tool.
(function(d, debug){
var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/en_US/all" + (debug ? "/debug" : "") + ".js";
ref.parentNode.insertBefore(js, ref);
}(document, /*debug*/ false));
}
};
此外,为了使FB.logout() 正常工作,还需要做的另一件事是在<div id="fb-root"></div> 周围使用constant template helper。所以你的代码应该是这样的:
<body>
{{#constant}}
<div id="fb-root"></div>
{{/constant}}
<!-- rest of body... -->
我还发现有必要把fb-root紧跟在body之后。
http://evee.meteor.com有一个实时应用程序运行这样的代码
你可以在这里找到它的源代码:https://github.com/fjsj/evee/
(检查fbLogin.js 以获取created 和app.html 以获取constant 和fb-root)
奖励(如何使用 Meteor 提供 channel.html 文件)
截至 2013 年 1 月,Meteor 不支持服务器端路由来提供静态 HTML。那么如何用 Meteor 制作channel.html 呢?将其放入 /public 将不起作用,因为 .html 文件由 Meteor 处理为模板。
通过使用 Meteor 内部,这是可能的!正如this answer 所建议的,我们需要使用类似中间件的方法(由Connect 提供支持)。只需将其放在您的 /server 上(注意它将在 yourapp.meteor.com/fb/channel.html 上提供):
// serve channel.html file
var connect = __meteor_bootstrap__.require("connect");
__meteor_bootstrap__.app
.use(connect.query())
.use(function(req, res, next) {
// Need to create a Fiber since we're using synchronous http
// calls and nothing else is wrapping this in a fiber
// automatically
Fiber(function () {
if (req.url === "/fb/channel.html") {
res.writeHead(200, {'Content-Type': 'text/html'});
res.end('<script src="//connect.facebook.net/en_US/all.js"></script>');
} else {
// not an channel.html request. pass to next middleware.
next();
return;
}
}).run();
});
这也适用于生产和code is available at GitHub(包括缓存标头)。