RailkedIn on Railsでサインアップする

10913 ワード

OAudio 2を使用することによってユーザーがLinkedInを通してあなたのRailsアプリにサインアップするのを許す方法の簡単なチュートリアル。


イントロ


プロセスの真ん中で壊れたチュートリアルの多くの後、Stackoverflow(私は今、WordOfは今Wordの場合)、奇妙なバグ、および16杯のコーヒー私は誰かの作業を容易にするためにこのチュートリアルを書くことを決めた作品を推測する.
Ruby on RailsアプリケーションでRuby Gemを使用します.
注:私の実際のセットアップは柵6.0.3.4およびルビー2.6.5です

LinkedInセットアップ


まず最初にLinkedInでログインするには、まずLinkedInアプリが必要です.
1 -に移動し、サインをクリックし、“作成アプリ”をクリックしてください
注:このアプリは、1つを持っていない場合は、会社のページに関連付けられている必要がありますそれを作成します.
2 -フォームを入力し、アプリケーションを確認する手順に従ってください.あなたは、彼らはあなたがアプリケーションを作成している管理者のページに検証URLを送信するよう依頼するこの手順を取得する必要があります👇🏻
Devise
注:検証プロセスは数分以上かかるべきではありません.
3 -今、あなたは、製品のタブの下に、“ログインしてログイン”を選択したアプリケーションを持っている.

4 -メッセージが消えるまで、あなたは数分後にあなたのページをリフレッシュします.
5 -認証キー(クライアントIDとクライアントの秘密の両方)を取得するには、“Auth”タブに移動します.

6 -最後になりましたが、少なくとも、LinkedInアプリケーションでURLをLinkedInで正常にログインした後にリダイレクトするように指示する必要があります.それで、我々の開発URLに我々のアプリのための認可されたリダイレクトURLを更新しましょう:

レールセットアップ


我々は我々のアプリケーションに加えることに集中したいので(そして、そこで考案することでRailsアプリを作成する方法に関する10億チュートリアルがあります)、我々は、すでに工夫セットアップを持っている基本的なRailsテンプレートから始めます
rails new --database postgresql -m
注:あなたがしたい場合は、ゼロから独自のアプリケーションを作成することができますし、セットアップに従ってください.

Railsの設定


私たちの認証キーをhere内蔵機能を使用して起動します.
EDITOR='code --wait' rails credentials:edit
このようにキーを追加する必要があります.
linkedin:
   api_id: 86***********af
   api_key: ns***********LQ
注意:これはYAMLファイルですので、インデントを尊重する必要があります.
第二に、我々は宝石を宝石ファイルに追加します
gem "omniauth", "~> 1.9.1"
gem "omniauth-linkedin-oauth2"
とバンドル
bundle install
注意:私たちはOmniAuthのこのバージョンを使用しているので、新しいバージョンはまだ考案と互換性がありません. .
今、私たちはOneNauthをLinkedInで使用し、どこで認証キーを見つけるつもりかを説明する必要があります.
それで、あなたの' config/initializers/deviseに行きなさい.rb ' fileとadd :
[...]
config.omniauth :linkedin, Rails.application.credentials[:linkedin][:api_id], Rails.application.credentials[:linkedin][:api_key]
[...]
その後、ユーザモデル( deviseで作成されたもの)をOmniAuthを通してログインし、プロバイダをLinkedInとして設定します.
class User < ApplicationRecord
   [...] 
    devise :omniauthable, omniauth_providers: %i[linkedin]
   [...]
end
注意:この行を追加する必要があります.
我々はLinkedInのアプリを我々はLinkedInを介して正常にログインした後に行くには、URLを覚えていますか?そのルートを処理するアプリケーションを準備しましょう.
コンフィグ/ルートに行こう.rb ' fileとadd :
devise_for :users, controllers: { omniauth_callbacks: 'users/omniauth_callbacks' }
注意: ' deviseRadio for : user 'は、すでに**コントローラ*部分だけを追加する必要があります.
次のルートを作成します.
Prefix: user_linkedin_omniauth_callback 
Verb: GET|POST 
URI Pattern: /users/auth/linkedin/callback(.:format)                                                  Controller#Action: users/omniauth_callbacks#linkedin
デフォルトでは、deviseによって作成されたユーザーだけが属性メールとパスワードを持っています.LinkedInによって提供された情報を利用したいなら、十分ではありません.ですから、マイグレーションを伴うユーザにいくつかの属性を追加しましょう.
rails g migration AddProviderToUsers provider uid first_name last_name picture_url
次の移行ファイルを作成します.
class AddProviderToUsers < **ActiveRecord::Migration[6.0]
  def change
    add_column :users, :provider, :string
    add_column :users, :uid, :string
    add_column :users, :first_name, :string
    add_column :users, :last_name, :string
    add_column :users, :picture_url, :string
  end
end
では、移行を実行できます.
rails db:migrate
したがって、ユーザモデルには必要な属性がすべてあり、ユーザモデル( ' app/model/user . rb ')に2つのメソッドを追加してLinkedInによって提供されるデータを管理します.
注意:最初のメソッドは、ユーザのモデルのためにデバイスのNewRange WithSessionセッションメソッドを再定義し、2番目のメソッドはLinkedIn資格情報(UIDとプロバイダの組み合わせ)でログインしている既存のユーザーを検索しようとします.そして、それが1つを見つけられなければ、LinkedInによって提供された情報で新しいユーザを作成します.
ので、私たちのユーザーモデルは現在、準備ができている次のステップは、我々のアプリで作成されたコールバックルートを処理するコントローラを作成することです.
mkdir app/controllers/users
touch app/controllers/users/omniauth_callbacks_controller.rb
LinkedInからリダイレクトするときに呼び出されるメソッドを追加しましょう.
ほとんど完了、今それをテストする時間です!単純なブートストラップNavbarを追加しましょう.
touch app/views/shared/_navbar.html.erb
そして、あなたの'残りNavbarにこれを加えてください.HTML .erb '
あなたのアプリケーションでNavbarとRails Credentialを追加することを忘れないでください.HTML .ERBファイル
そして、それ!これでNavbar ' login 'リンクをクリックしてログインして、' LinkedIn 'というオプションを選択します.
See more
Bootstrap CDN

オプション:パスワードなしでLinkedInユーザーのプロファイルを編集する


ちょうどあなたがまだ通知しなかった場合は、このプロセスを通じて作成されたユーザーは、プロファイルを編集することはできません.なぜ?なぜなら、彼らは確認パスワードを持っていないからです.あなたのユーザーが最初の名前またはLastCountの名前を更新する必要がある場合は、それを修正しましょう.
これを達成するためには、我々の手を汚すコントローラとビューの深さに汚れを取得する必要があります.
まず、私たちのapp/view/devise/registrations/EditでフィールドFirstClose名とLastChord名を追加しましょう.HTML .ERBのファイルを編集してください.
注意: if文を追加すると、currentRoundユーザーがプロバイダを持っているかどうかを確認します.
さて、私たちはdeviseの登録コントローラを書き換えるつもりです.
rails generate devise:controllers "" -c=registrations
今、私たちのルートを更新することにより、この新しいコントローラを使用して我々の工夫ルートを教えてくれます.rb ' file :
devise_for :users, controllers: { omniauth_callbacks: 'users/omniauth_callbacks', registrations: 'registrations' }
そして、その' registrationsLen Controllerの内容を取り替えましょう.rb 'のようになります.
注:長い話短い、我々は、彼らのプロフィールを更新しようとしているユーザーがLinkedIn(彼らのプロバイダー属性が空白でない)を通して記録されたならば、我々はパスワードを要求せずに更新しなければならないということを考案しています.
最後に、新しい属性をdeviseHand ParameterRange Sanitizer (セキュリティ上の理由)を通過させる必要があります.rb ' file :
そして、それ!あなたはLinkedInを介してサインアップした場合でも、あなたのfirstCount名とLastCard名前フィールドを更新することができます.

生産についてはどうですか。


生産において、我々がちょうど我々が使用するホスティングプロバイダーで我々のRails資格情報のマスターキーを構成する必要があります.たとえば、を使用している場合、
heroku config:set RAILS_MASTER_KEY=30**************************354d
また、LinkedInアプリケーションからコールバックURLを更新する必要があります.

あなたが誰がこれを書いたかについて疑問に思うならば、私に私自身について話させてください.
私の名前はニコプロトです、そして、私は私のウェブ開発庁Herokuの開発者です.あなたが我々が何をするかについて興味があるならば.