Rails4でOmniauthを使って、Facebookログインを実装する

Rails4でOmniauthを使って、Facebookログインを実装

Omniauth概要

開発者用サイト

• intridea/omniauth · GitHub
• OmniAuth Facebook by mkdynamic

特徴

• Omniauthとは、facebookログインやtwitterログインを簡単に実装するためのgemのこと

今回の目的

• 簡単にFacebookログインを実装する

作業

1. facebookアプリの設定(30min)
2. Gemfileの設定(2min)
3. modelの作成(30min)
4. controllerの作成(20min)
5. routeの設定(20min)
6. viewの作成(2min)

facebookアプリの設定

1. Home - Facebook Developersで、ディベロッパー登録を行う
2. ヘッダー部の「Apps」をクリックする
3. 新しいAppを作成する
4. Website with Facebook Loginに自分のサイトのurlを登録する
5. 「App ID」「App Secret」を控えておく

• 注意: 実験的にrailsの開発環境(WEBrick)で試す場合のurlはxxx.xxx.xxx.xx:3000 まで記載しないといけない

Gemfileの設定

• 参考url Sergio Tapia Gutierrez : Ruby on Rails 4 - Authentication with Facebook and OmniAuth.

1. gemをインストールする

gem 'omniauth'

gem 'omniauth-facebook'

modelの作成

1. Userモデルにuid, provider, tokenカラム(string)を追加

rails g model User provider uid token

1. userが登録されているか判定するメソッドを定義する

class User < ActiveRecord::Base

  def self.find_or_create_by_auth(auth)

    user = User.where(["provider = ? and uid = ?", auth,provider, auth,uid])

    if user.blank?

      user = User.new

      user.provider = auth.provider

      user.uid = auth.uid

      user.token = auth.credentials.token

      user.save!

    end

    user

  end

end

controllerの作成

1. sessionを設定するためのactionをsession_controllerに定義する

class SessionsController < ApplicationController

  def create

    auth = request.env["omniauth.auth"]

    user = User.find_or_create_by_auth(auth)

    session[:user_id] = user.id

    redirect_to root_url

  end
  def destroy

    session[:user_id] = nil

    redirect_to root_url

  end

end

routeの設定

1. facebookのログイン・認証完了後のリダイレクト先、失敗後のリダイレクト先を自分のサイトの任意のページに紐づける

# welcome#indexをルートに設定する

root "welcome#index"

# facebookのログイン・認証が完了した後のリダイレクト先(auth/facebook/callback)とsession#createを紐づけ

match 'auth/:provider/callback', to: 'session#create', via: [:get, :post]

# facebookのログイン・認証が失敗した後のリダイレクト先(auth/failure)とrootを紐づけ

match 'auth/failure', to: redirect('/'), via: [:get, :post]

# signout_urlとsession#destroyを紐づけ

nmatch 'signout', to: 'session#destroy', as: 'signout', via: [:get, :post]

viewの作成

1. ログインするための画面を作る(welcome#index)

<%- current_user = User.find_by_id(session[:user_id])-%>


  <% if current_user %>

    <%= link_to "Sign out", signout_path, id: "sign_out" %>

  <% else %>

    <%= link_to "Sign in with Facebook", "/auth/facebook", id: "sign_in" %>

  <% end %>

成果物

• Seams

結果・感想

• 簡単にログインを実装できた
• いろいろな情報を取得することができるので、どこまで自分が必要なのか？を判断すること。DBの設計が大変（特にlogin_id, passwordの基本的な認証との共存）
• うまいことやってくれるので、仕組みを理解したい人は、下記リンクなどを参考にするとよいと思う
• 第1回 OAuthとは？―OAuthの概念とOAuthでできること：ゼロから学ぶOAuth｜gihyo.jp … 技術評論社