Authentication of Rails App using Devise through FACEBOOK Login
In my previous blog I have explained in detail, how to provide a simple authentication using Devise gem
Now lets start in step by step guide on how to integrate Facebook login using devise.
INSTALL THE DEVISE , OMNIAUTH AND OMNIAUTH-FACEBOOK GEM.
Open up your Gemfile and include these gems.mentioned below gems in your gem file Devise gem is used here to provide authentication, omniauth is a gem used for connecting to social websites facebook, google, and twitter, omni-auth facebook gem is used here to communicate with the facebook API's here we need to all these three gems for to obtain authentication through Facebook login credentials
gem 'devise'
gem 'omniauth'
gem 'omniauth-facebook'
Then in your terminal run the
bundle install
command to install the gem.
$ bundle install
RUN SOME DEVISE GENERATORS TO SET UP THE INITIAL CONFIGURATIONS.
Run this command from your terminal:
$ rails generate devise:install
This generator installs the initializer that configures all of Devise's available settings.
GENERATE YOUR USER MODEL.
Next we need to generate our User model. I'm going to name it User
but you can name it whatever you like, just replace User
with Whatever
.
$ rails generate devise User
$ rake db:
migrate
Go the user model and add the following line
devise :omniauthable
We need two more coloums to check the Provider whether Google or facebook and its respective UID so add the migration
$ rails g migration AddProviderToUser provider:string uid:string
Now run rake db:migrate
We should create facebook APP-ID and SECRET at developers facebook account, lets start through step by step, how to to create..
Step 1:- Login to your Facebook account. with your username/email and password.
Step 2:- Login to Facebook developer’s website with your Facebook credentials. Then Create an application by clicking on Apps >Create a New App
Note:- If you are creating a Facebook App for the first time, you will need to enter your phone number and verify it through SMS.
Step 3:- Enter a Name for your App (I recommend you to enter the name of your blog/website). Choose a category and then click on Create App button
Step 4:- Click on App platform button on the App dashboard.
Step 5:- Click on Website icon.
Step 6:- Enter the correct URL of your website. If you don’t enter correct URL, Facebook Publish wont work
And here you have your APP ID and SECRET KEY. Secret key is usually hidden and you have to click on showbutton to reveal it.
Now you need to use those APP ID and Secret into your application at config/initializers/devise.rb
require 'omniauth-facebook'
config.omniauth :facebook, "APP ID", "APP SECRET"
Now goto layout file and add the following snippet
<% if user_signed_in? %>
<p>Welcome <%= current_user.email %></p>
<%= link_to 'Logged In [click to logout]', destroy_user_session_path, :method => :delete %>
<% else %>
<p>You are not signed in.</p>
<%= link_to 'Login', new_user_session_path %>
<%= link_to 'SignUp', new_user_registration_path %>
<%= link_to 'Login with Facebook', user_omniauth_authorize_path(:facebook) %>
<% end %>
Create a new controller named as"omniauth_callbacks_controller.rb".
$ rails g controller omniauth_callbacks
change the routes with the following code
devise_for :users, :controllers =>{ : omniauth_callbacks => "omniauth_callbacks" }
Add the following method under omniauth_callbacks_controller.rb
class OmniauthCallbacksController < Devise::OmniauthCallbacksController def facebook @user = User.find_for_facebook_oauth(request.env["omniauth.auth"], current_user) if @user.persisted? sign_in_and_redirect @user, :event => :authentication #this will throw if @user is not activated set_flash_message(:notice, :success, :kind => "Facebook") if is_navigational_format? else session["devise.facebook_data"] = request.env["omniauth.auth"] redirect_to new_user_registration_url end end end
And finally add the following block under user.rb model
def self.find_for_facebook_oauth(auth, signed_in_resource=nil) user = User.where(:provider => auth.provider, :uid => auth.uid).first if user return user else registered_user = User.where(:email => auth.info.email).first if registered_user return registered_user else user = User.create( provider:auth.provider, uid:auth.uid, email:auth.info.email, password:Devise.friendly_token[0,20], ) end end end
Its finally finished, now you run the server and can easily login through facebook into your web app
The above snap explains how the devise+omniauth+facebook login works