Menu

Category

Archive

logo


Facebook ログイン with Omniauth [ Ruby on Rails ]

2013-12-16 18:49:00 +0900
  • このエントリーをはてなブックマークに追加

RailsでのFacebookログインの実装。Facebookログインをサイトに設定することで、ユーザーはワンクリックでユーザー登録を完了することができ、パスワードやE-mailアドレスを入力する必要がなくなることもあるので、かなり楽です。実装も結構簡単でした。

準備

Gemfile

1 # Gemfile
2 gem omniauth'
3 gem 'omniauth-facebook

Gemfileを準備し、 $ bundle install . ここまではもうおなじみですね。

Facebook アプリ作成

また、Facebookログインをサイトに組み込むには、Facebook側でアプリを作成し、自分のサイトを登録しておく必要があります。まず、ここ にアクセスし、アプリを作成します。アプリ作成に関しては特に問題ないと思います。ローカルで動作確認する際には、各アプリ設定ページ中程にある Website with Facebook Login という項目を有効にし、http://localhost:3000/ を設定します。これを忘れると、 Invalid blabala とエラーがでます。設定ページにある ”App ID” と ”App Secret” をあとで使います

Omniauth.rb

1 #config/initializers/omniauth.rb
2 Rails.application.config.middleware.use OmniAuth::Builder do
3   provider :facebook, App ID", “App Secret"
4 end

config/initializers/ に上記のファイルを作成します。

routes.rb

1 #config/route.rb
2 match "/auth/:provider/callback" => "sessions#createByFacebook", via: get'

上記の match を追加。2つ目のダブルクォートの中身は Facebook からコールバックで自分のサイトに戻ってきた時に処理するコントローラーのアクションを設定しておけば大丈夫だと思います。今回、Facebook の Facebook Login 機能を使って、サイトでユーザー登録とログインがすることができるよう実装してみます。

実装

コントローラー

今回、コントローラーでは、既に Facebook によりユーザー登録やログインをしたことがあるユーザーか判断し、そうでなければ Facebook から持ってきた情報を使い新しいユーザーを作成します。どちらも場合もユーザー変数を作成し、ログイン・各ユーザーページに遷移します。

1 #session_controllers.rb
2 def createByFacebook
3      auth = request.env["omniauth.auth”] # FB info like name, email etc
4      student = Student.find_by_provider_and_fbid(auth["provider"],auth["uid"]) || Student.create_with_fb(auth,classID)  #*
5      sign_in student
6      redirect_to student
7 end

一行目は Facebook から取ってきた情報です。これを既存ユーザーかどうか判断する際に追加、また、新規ユーザーを作成する際にはモデルのメソッドに引数として渡し、この情報をもとに新規ユーザーを作成します。コメント * の部分が、上記の 既存のユーザーかどうかの判断するポイントです。

モデル

今回は Student というモデルを Facebook 情報を使い作成します。

 1 # Create Account from FB
 2   def self.create_with_fb(auth,classID) # create new student from FB
 3  
 4     s = Student.find_by_email(auth["info"]["email"]) # user registered before
 5     if s.present?
 6       s.provider = auth["provider"]
 7       s.fbid        = auth["uid"]
 8       s.name     = auth["info"]["name"]
 9       return s
10     else
11       newS = Student.new
12       newS.provider = auth["provider"]
13       newS.fbid        = auth["uid"]
14       newS.email      = auth["info"]["email"]
15       newS.name     = auth["info"]["name"]
16       newS.password = SecureRandom.hex(9)
17  
18       if newS.save
19         if !classID.blank?
20           classID.split(",").map{
21               |eachclassids|
22                 ClassStudent.create(student_id: newS.id, klass_id: eachclassids)
23           }
24         end
25       end
26  
27       return newS
28     end
29   end

この箇所はあまり自信がないので問題があったらご指摘いただきたいです。ここでは、ユーザーが Facebook でログインするのは初めてだけど、既にサイトのユーザーだったというケースを E-mail アドレスでチェックしています。もし Facebook に登録されたアドレスが既に存在すれば、Facebook の UID と privider つまり facebook ということを保存しています。正真正銘、新規ユーザーの場合には else 文以下で新規ユーザーを作成しています。僕のケースでは Student が持つクラス(授業名)を登録する際に Student の id が必要でした。そこでまず newS (新しい生徒)を保存して、その後に中間テーブルに student_id と klass_id を登録しました。なんだかあまりかっこよくないです。 いずれの場合にも更新 or 作成したモデルを return し、2.1 のコントローラーに返します。そのモデルを使い、ログイン・各ユーザーページにリダイレクトという流れです。