Click here to Skip to main content
Click here to Skip to main content
Technical Blog

Tagged as

Facebook App by Rails using Koala

, 16 Sep 2011 CC (ASA 2.5)
Rate this:
Please Sign up or sign in to vote.
To get to know much about developing Facebook applications using a server side, I have chosen with Koala for Rails.  For .NET, Facebook C# SDK is being well supported by Microsoft also (http://facebooksdk.codeplex.com/).  In this post, I explain how to use Koala in your Rails applications.  As any F

To get to know much about developing Facebook applications using a server side, I have chosen with Koala for Rails.  For .NET, Facebook C# SDK is being well supported by Microsoft also (http://facebooksdk.codeplex.com/).  In this post, I explain how to use Koala in your Rails applications.  As any Facebook app, the prerequisite  are:

  • Facebook account (of course you should be the one in the 10% of world population :) )
  • A Facebook application (which could be in sandbox mode), so you should have App ID, App Secret and Callback URL
  • A Rails application in your local machine and the Facebook app pointed to this as http://localhost:3000 (default port for Mongrel or WEBrick)

Installing Koala

Install Koala gem from https://github.com/arsduo/koala by using sudo gem install koala –pre

Configuring Koala

Create facebook.yml in /config with the following content

# config/facebook.yml
development:
 app_id: 184xxxxxxxxxxxx
 secret_key: 80xxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
 callback_url: http://localhost:3000/
test:
 ...
production:
 ...

Add the following in config/environment.rb

# config/environment.rb
# in Rails::Initializer.run do |config|
config.action_controller.allow_forgery_protection = false
config.gem "koala"

The first line enables Facebook callback to your server.  The following line adds koala gem into this application.

Create koala.rb in /config/initializers with the following content

# config/initializers/koala.rb

module Facebook
 CONFIG = YAML.load_file(Rails.root + "/config/facebook.yml")[Rails.env]
 APP_ID = CONFIG['app_id']
 SECRET = CONFIG['secret_key']
 CALLBACK_URL = CONFIG['callback_url']
end

Koala::Facebook::OAuth.class_eval do
 def initialize_with_default_settings(*args)
 case args.size
 when 0, 1
 raise "application id and/or secret are not specified in the config" unless Facebook::APP_ID && Facebook::SECRET
 initialize_without_default_settings(Facebook::APP_ID.to_s, Facebook::SECRET.to_s, Facebook::CALLBACK_URL.to_s)
 when 2, 3
 initialize_without_default_settings(*args)
 end
 end

 alias_method_chain :initialize, :default_settings
end

The above code loads the Facebook.yml settings into Facebook, so you can access AppID, AppSecret and CallbackURL anywhere in your application in an unified way.  The following OAuth extension method is taken from Koala guidance to simplify the instantiation of OAuth.new.

Controller Part

In ApplicationController, add the following

#app/controller/application.rb

# protect_from_forgery

before_filter :parse_facebook_cookies
def parse_facebook_cookies
 @facebook_cookies = Koala::Facebook::OAuth.new.get_user_info_from_cookie(cookies)
end

Note that protect_from_forgery has been commented.  The following instructions, let this application load OAuth details from cookies for getting Facebook access token.

Your Login Page

Add the following on your login page layout, in this case /app/views/layout/login.html.erb

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"
 xml:fb="http://www.facebook.com/2008/fbml">
<head>
 <meta http-equiv="content-type" content="text/html;charset=UTF-8" />
 <title>Udooz Sample</title>
 <script type="text/javascript" src="http://connect.facebook.net/en_US/all.js"></script>
</head>
<body>

<p style="color: green"><%= flash[:notice] %></p>
<div id="fb-root"></div>

<script type="text/javascript">
 FB.init({
 appId  : '<%= Facebook::APP_ID %>',
 status : true, // check login status
 cookie : true, // enable cookies to allow the server to access the session
 xfbml  : true  // parse XFBML
 });

 FB.login(function(response) {
 if (response.session) {
 location.href = '/home'
 } else {
 // user cancelled login
 }
});
</script>
<h1>udooz</h1>
</body>
</html>

In this example, I’ve used Facebook JavaScript SDK for login screen.  To use this, I’ve include FBML scheme in <html> as xml:fb=”http://www.facebook.com/2008/fbml” followed by referring Facebook SDK script file.

You Home Page

In your home page, add the following things.

In app/controllers/HomeController.rb

class HomeController < ApplicationController
  def index
    graph = Koala::Facebook::GraphAPI.new(@facebook_cookies["access_token"])
    @likes = graph.get_connections("me", "likes")
  end
end

In the above code, new Graph instance has been created.  By using this, I’ve invoked the currently logged in user’s likes.

In app/views/home.html.erb

<table border="0">
 <% if @likes %>
 <% for like in @likes %>
 <tr>
 <td><b><%=h like["name"]%> </b></td>
 </tr>
 <tr>
 <td><%=h like["category"] %></td>
 </tr>
 <tr>
 <td>&ndash;</td>
 </tr>
 <% end %>
 <% end %>
</table>

Now, run your application.  Hope it would be easy.

License

This article, along with any associated source code and files, is licensed under The Creative Commons Attribution-ShareAlike 2.5 License

Share

About the Author

M Sheik Uduman Ali
Architect Aditi
India India
Working as Architect for Aditi, Chennai, India.
 
My Website: www.udooz.net
 
My Blog: www.udooz.net/blog
Follow on   Twitter

Comments and Discussions

 
QuestionInformative PinmemberVenkatesan Jagadisan19-Sep-11 17:42 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

| Advertise | Privacy | Terms of Use | Mobile
Web02 | 2.8.141220.1 | Last Updated 16 Sep 2011
Article Copyright 2011 by M Sheik Uduman Ali
Everything else Copyright © CodeProject, 1999-2014
Layout: fixed | fluid