読者です 読者をやめる 読者になる 読者になる

railsでgithubログインを実装する

  1. githubにapplicationを追加する (githubにアクセス-> settings -> Oauth applications-> developer applicationのタブ内のresister new applicationをクリック)

application名とurlとAuthorization callback URLにそれぞれ記入し作成(この時にのちに使うclient-idとclient-secretが生成される)

urlはlocalhost://3000でおk

Authorization callback URLも http://localhost:3000/auth/github/callback とかで大丈夫です

gem 'omniauth-github'  

$ bundle install

userテーブルに新しく3つのカラムを追加していく $ rails g migration add_columns_to_user provider:string uid:string image:string

$ rake db:migrate

app/model/user.rbに書いていく ちなみにuserモデルはdeviseを使っていますのでその前提で書いています>_<。

class User < ActiveRecord::Base

  devise :database_authenticatable, :registerable,
         :recoverable, :rememberable, :trackable, :validatable, :omniauthable #最後の:omniauthableのみを追記しました。

def self.find_for_github_oauth(access_token, signed_in_resource = nil)
    data = access_token['info']
    user = User.where(:provider => access_token['provider'], :uid => access_token['uid']).first

    if user
      return user
    else
      registered_user = User.where(:email => data['email']).first
      if registered_user
        return registered_user
      else

        if data['name'].nil?
          name = data['nickname']
        else
          name = data['name']
        end

        user = User.create(
          name: name,
          provider: access_token['provider'],
          email: data['email'],
          uid: access_token['uid'],
          image: data['image'],
          password: Devise.friendly_token[0, 20],
          )
      end
    end
  end
end

続いてinitializers/devise.rbをいじる

#見やすくするために不要なコメント行は全て削除しています
Devise.setup do |config|

  require 'devise/orm/active_record'

  config.case_insensitive_keys = [:email]
  config.strip_whitespace_keys = [:email]
  config.skip_session_storage = [:http_auth]
  config.stretches = Rails.env.test? ? 1 : 10

  config.reconfirmable = true
  config.expire_all_remember_me_on_sign_out = true
  config.password_length = 8..128
  config.reset_password_within = 6.hours
  config.sign_out_via = :delete

  require 'omniauth-github'
  config.omniauth :github, 'Client-id', 'Client-Secret', scope: 'user:email'
 #'Client-id', 'Client-Secret'はgithubでapplicationを登録した時に生成されたものをそれぞれクオーテーション内に貼り付けてください

end

続いてcontrollerを新規で作成 app/controllers/omniauth_callbacks_controller.rbで作成しました

class OmniauthCallbacksController < Devise::OmniauthCallbacksController

  def github
    @user = User.find_for_github_oauth(request.env["omniauth.auth"], current_user)
    if @user.persisted?
      flash[:notice] = I18n.t "devise.omniauth_callbacks.success", :kind => "Github"
      sign_in_and_redirect @user, :event => :authentication
    else
      session["devise.user_data"] = request.env["omniauth.auth"]
      redirect_to new_user_registration_url
    end
  end

end

ルーティング設定

routes.rb


devise_for :users, :path => '', :path_names => { :sign_in => 'login', :sign_out => 'logout', :edit => 'profile' }, :controllers => { :omniauth_callbacks => 'omniauth_callbacks' }

あとはviewで新規登録(ログイン)リンクを生成するだけです

views/devise/registrations/new.html.erb

<%= link_to "sign up with Github", user_omniauth_authorize_path(:github) %>

装飾は割愛してますのでお好きなようにどうぞ!

以上!! facebookもにこんな感じで実装できちゃうので試してください。 f:id:snsn19910803:20160724134703p:plain