Over the last few months I’ve received quite a few requests for Facebook Connect support in Facebooker. Thanks to Kevin Lochner, I’m proud to announce Facebook Connect support in Facebooker. Read on to learn how to create a simple Facebook Connect application.
The setup of a Facebook Connect application is very similar to that of a Facebook Platform Application. You’ll need to create an application using the Facebook Developer tool and then build a Rails application and install the Facebooker plugin. If you need help with this, check out the screencast or My Book. You’ll need to set up your facebooker.yml and configure a callback URL on Facebook.
Once you’ve got a basic application set up and running, we’ll need to generate an
A file named
xd_receiver.html will be generated and placed in your
public directory. Make sure this file is added to your source code control system. It must exist for Facebook Connect to work.
If all goes well, you should see a login button. If you don’t, you’ll need to verify that things are configured just right. There’s a lot of magic going on and it tends to be brittle. Make sure that your callback URL is correctly set and that you are accessing your site using the callback URL. Make sure that your
public/xd_receiver.html file exists. Finally, make sure that you have correctly set up your facebooker.yml file.
Take a look at the source of your page. Doesn’t that <fb:login-button> tag look strange? To render FBML inside your page, Facebook is using into the HTML equivalents. The login button is just one of many tags we can use. For example, we can include a user’s profile photo by calling
fb_profile_pic Add a call to show your own profile.
Notice that Facebook isn’t showing your picture. That’s because of privacy restrictions. Before we can see information about a Facebook user, we’ll need to login. Click the “connect” button and you should see a popup prompting you to log in. After logging in, your profile picture will now be shown.
Getting access to FBML outside of the Facebook canvas is cool, but it’s just a start to what we can do. When we login using Facebook Connect, Facebook sets several cookies that our application can use to access a Facebook session. Facebooker knows how to use these cookies to set up a facebook session. Add the following code to your controller:
before_filter :set_facebook_session helper_method :facebook_session
That code sets up the users Facebook session and makes it available to the view. With it, you have access to the normal REST API as you can see in the following code.
<% if facebook_session %> <h2>You are logged in as <%= facebook_session.user.name %></h2> <% else %> <h2>You are not logged in!</h2> <% end %>
This means you can ask for data about a user like their name and their friends. You can also post stories to their feed! You have most of the power of a Facebook Platform application inside your existing code!
This support is still very new, so make sure you join the Facebooker mailing list on Rubyforge if you decide to use it. Let us know what you build with it!
Thanks again to Kevin Lochner who provided the patch to support authentication using cookies. Thanks also to Nate Kontny of Inkling Markets who provided a great overview of how Facebook Connect works! Happy New Year everyone! </p