【初心者向け】ログイン認証も簡単！deviseの使い方（Rails）

2018年11月23日 Ruby on Rails, プログラム関係

こんにちは、だいきです。

今回は、Rubyのフレームワークである「Ruby on Rails」のgemの１つであり、ログイン認証を簡単に実装することができる「devise」の使い方を解説していこうと思います。

deviseの使い方

deviseをインストールする

まずは、gemをインストールしていきましょう。

Gemfileに以下の文字を追加して、bundle installを実行していください。

gem "devise"

bundle installを実行すると、以下のコマンドをターミナルで実行してください

rails g devise:install

以上のコマンドに成功すると、以下のような文字がターミナルに表示されます。

deviseの設定

「devise」はインストールしただけでは使えないので、次は「devise」を使えるように設定をしていきましょう。

まずは、先ほどのターミナルに書かれていた英語を訳していきましょう。

英語の訳

1.環境ファイルにデフォルトのURLオプションが定義されていることを確認してください。ここにあるのは、config/environments/development.rb:に開発環境に適したデフォルトのURLオプションの例です。

config.action_mailer.default_url_options = { host: 'localhost', port: 3000 }

プロダクションでは、ホストはアプリケーションの実際のホストに設定する必要があります。

2.config/routes.rb.にroot_urlを何かに繋がるように定義されているか確認してください。例えば、

root to: "home#index"
のように設定してください。

3.app/views/layouts/application.html.erbにフラッシュメッセージがあることを確認してください。例えば、

<p class="notice"><%= notice %></p>
 <p class="alert"><%= alert %></p>

のように設定してください。

4.HerokuでRails 3.2のみを使用してデプロイする場合は、次のように設定します。

config.assets.initialize_on_precompile = false

config / application.rbでは、資産をプリコンパイルするときに、アプリケーションがDBにアクセスしたり、モデルをロードしたりしないように強制します。

5.カスタマイズ用のDeviseビューをアプリにコピーするには、次のコマンドを実行します。

rails g devise:views

１つ目の設定

config/environments/development.rbに、config.action_mailer.default_url_options = { host: ‘localhost’, port: 3000 } を付け加えましょう。そうすると以下のようになります。

Rails.application.configure do
  (省略)...
  config.action_mailer.default_url_options = { host: 'localhost', port: 3000 }
end

２つ目の設定

次は、http://localhost:3000/にアクセスした際に表示されるページを指定しましょう。

３つ目の設定

ログインしたときやログアウトしたときに、メッセージが表示されれるようにします。

以下のように<body>の下に、以下のコードを追加しましょう。

<p class="notice"><%= notice %></p>
<p class="alert"><%= alert %></p>

app/views/layouts/application.html.erb

<!DOCTYPE html>
<html> 
  <head>
    <title>Daiki</title>
    <%= stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track' => true %>
    <%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
 </head>
 <body>
    <p class="notice"><%= notice %></p>
    <p class="alert"><%= alert %></p>
    <%= yield %>
 </body> 
</html>

以上のようになります。

４つ目の設定

４つ目の設定は、Rails3.2でHerokuにデプロイするための設定です。現在はRails5なのでこの設定は必要ありません。

５つ目の設定

DeviseのViewを変更したい場合は、以下のコマンドをターミナルで入力してください。

rails g devise:views

すると、以下のようなファイルが作られます。

app/views/devise/shared/_links.html.erb (リンク用パーシャル)
app/views/devise/confirmations/new.html.erb (認証メールの再送信のための画面)
app/views/devise/passwords/edit.html.erb (パスワードの変更画面)
app/views/devise/passwords/new.html.erb (パスワードを忘れたときに、メールを送る画面)
app/views/devise/registrations/edit.html.erb (ユーザー情報の変更画面)
app/views/devise/registrations/new.html.erb (ユーザーの登録画面)
app/views/devise/sessions/new.html.erb (ログイン画面)
app/views/devise/unlocks/new.html.erb (ロック解除メール再送信のための画面)
app/views/devise/mailer/confirmation_instructions.html.erb (メール用アカウント認証)
app/views/devise/mailer/password_change.html.erb （メール用パスワード変更完了）
app/views/devise/mailer/reset_password_instructions.html.erb (メール用パスワードリセット)
app/views/devise/mailer/unlock_instructions.html.erb (メール用ロック解除)

モデルの作成

次は、モデルを作っていきましょう。今回はUserモデルを作っていきます。

ターミナルで以下のコマンドを実行してください。

rails g devise user

次に、以下のコマンドを実行してください

rake db:migrate

ここまで行うと、deviseでログイン機能を実行することができます。

ターミナルで、以下のコマンド行なって、

rails s

http://localhost:300/users/sing_inのURLにアクセスしてください。

以下のようなログイン画面ができれば成功です。

まとめ

初めて、「devise」を使う方にとって、「devise」の設定を行うのは難しいと思います。ぜひこの記事を読んで、「devise」をマスターしてください。次回は、「devise」を使ってGoogleからログインができるように実装していきます。

以上、だいきでした。