Railsでfacebook認証の実装方法（初心者向け）簡単！

初めに

ポートフォリオを作成する際に、『deviseでのログイン方法』＋『facebook認証を利用したログイン方法』を実装したのでメモを残します。

環境

・Ruby '2.3.8'
・Rails '5.2.3'

deviseの導入

Gemfile

gem 'devise'

$ bundle install
$ rails g devise:install
$ rails g devise user
$ rails db:migrate

以上でdeviseの導入は完了です。

カラムの追加

usersテーブル以下のカラムを追加します。
　1. uid　＝　facebookログイン時に取得してくるデータ
　2. provider = ログインに使用したプロバイダーを取得する（facebook、google、line等)

$ rails g migration AddColumnsToUsers uid:string provider:string

作成されたdb/migrate/xxxxxxxxxxxadd_columns_to_users.rbを確認し、内容に間違えがなければrails db:migrateを実行します。

facebook側の設定

1.facebookに接続し、新しいアプリを追加します。
表示名はアプリの名前です。
2.設定>ベーシックを選択後、ページの一番下のプラットフォームを追加するをクリックし、ウェブサイトを選択する。
サイトURLにhttp://localhost:3000/を入力する。
3.プロダクト＋をクリックし、Facebookログインを選択する。
対応アプリを聞かれるので、ウェブを選択する。
4.有効なOauthリダイレクトURIにhttps://localhost:3000/users/auth/facebook/callbackを記載する。

認証系gemの導入

Gemfile

gem 'omniauth'
gem 'omniauth-facebook'

$ bundle install

Rails側の設定

1.config設定

config/insitializers/devise.rbの一番下に以下を記述します。

devise.rb

 config.omniauth :facebook, FACEBOOK_ID='aaaaaaaa', FACEBOOK_SECRET_KEY='bbbbbbbbb'
end

aaaaaaaaにはfacebook_IDを入力します。
bbbbbbbbにはfacebook_secret_keyを入力します。
IDとsecret_keyは設定>ベーシックで確認出来ます。
※IDがアプリID、secret_keyがapp Secretです。

2.deviseにメソッド追加

app/model/user.rbを以下の様に変更します。

user.rb

devise :database_authenticatable, :registerable,
         :recoverable, :rememberable, :validatable, :omniauthable

3.Userモデルにfindメソッド実装

先ほどのapp/model/user.rbを以下の記述をに追加します。

user.rb

  def self.find_for_oauth(auth)
    user = User.where(uid: auth.uid, provider: auth.provider).first

    unless user
      user = User.create(
        uid:      auth.uid,
        provider: auth.provider,
        email:    auth.info.email,
        password: Devise.friendly_token[0, 20]
      )
    end
    user
  end
end

この記載により、facebook認証実施済みユーザはそのままログイン出来る様になります。
facebook認証する際には、uidとproviderとemailとpasswordを取得してきます。
パスワードはDevise.friendly_token[0, 20]により生成されます。そのパスワードはランダムに決まった数字20桁の為、登録したユーザには分かりません。

4.コールバック処理の実装

app/controllersにusersファイルを作成し、その中にomniauth_callbacks_controller.rbを作成します。
そして、以下の記述をします。

omniauth_callbacks_controller.rb

class Users::OmniauthCallbacksController < Devise::OmniauthCallbacksController
  def facebook
    callback_from :facebook
  end

  private
  def callback_from(provider)
    provider = provider.to_s

    @user = User.find_for_oauth(request.env['omniauth.auth'])

    if @user.persisted?
      flash[:notice] = I18n.t('devise.omniauth_callbacks.success', kind: provider.capitalize)
      sign_in_and_redirect @user, event: :authentication
    else
      session["devise.#{provider}_data"] = request.env['omniauth.auth']
      redirect_to new_user_registration_url
    end
  end

end

5.ルーティング設定

config/route.rbに以下を追加します。

route.rb

devise_for :users, controllers: { omniauth_callbacks: 'users/omniauth_callbacks' }

6.リンクの記載

リンクは以下の様になります。

new.html.erb

<%= link_to "facebook", user_facebook_omniauth_authorize_path  %>

参考資料

【開発メモ】RailsアプリでFacebookログインの認証機能を実装させる方法
Railsでomniauth(google/facebook/)実装方法

注意事項

facebookはHTTPSしか有効なOAuthリダイレクトURIに登録出来ません。
なので、開発環境なら誰でも使用出来ますがデプロイ後はHTTPSに変更する必要があります。

体験談

私はgoogle、facebook、LINEの認証を実装しました。
googleは特に変更することなくデプロイ後も使用できます。
LINEはemail情報を取得するのに申請を出さなければいけない為、前準備に時間が掛かります(約3週間)
twitterも同様に申請が必要です。

デプロイすることを考慮するとgoogle認証が一番簡単でした。

最後に

たったこれだけでfacebookでの認証が出来る様になります。
よければ参考にしてみて下さい。