はじめに
deviseを使うとユーザーのログイン・ログアウト機能などを簡単に実装できると聞いたので、早速使ってみました。
ただdeviseをインストールしてモデルを作成後に確認してみると name
カラムがデフォルトでは存在しなかったので、 name
カラムを追加してデータベースに保存できるようストロングパラメーターを設定してみることにしました。
基本的な手順はDevise - GitHubに書かれていることを参考にしました。
※Userモデルとビューを作成した後を想定しています。
deviseの導入は次が参考になりました。
手順
- コマンドを実行してマイグレーションファイルを作成
- マイグレーションに設定を加える
- ストロングパラメーターを設定
- フォームを修正
マイグレーションファイルを作成・設定
まずはじめにマイグレーションファイルを作成
$ rails g migration AddColumnToUsers name:string
追加されたマイグレーションファイルにNOT NULL制約やデフォルトの値に空文字などを追加します。
class AddColumnToUsers < ActiveRecord::Migration
def change
add_column :users, :name, :string, null: false, default: ""
end
end
追加後、保存したらマイグレートを実行
$ rails db:migrate
では nameカラム が追加されたのかを確認します。
コンソールを起動して、User.column_names
を実行することで確認することができます。
$ rails c
>> User.column_names
=>[
"id",
"email",
"encrypted_password",
"reset_password_token",
"reset_password_sent_at",
"remember_created_at",
"created_at",
"updated_at",
"name" <= 追加されていれば成功
]
ストロングパラメーターを設定して保存できるように
ユーザー登録画面などで入力されたユーザー名をUsersテーブルに保存させるには、ApplicationControllerで設定する必要があります。
class ApplicationController < ActionController::Base
# --- ここから ---
before_action :configure_permitted_parameters, if: :devise_controller?
protected
def configure_permitted_parameters
devise_parameter_sanitizer.permit(:sign_up, keys: [:name])
devise_parameter_sanitizer.permit(:account_update, keys: [:name])
end
# --- ここまでを追加 ---
end
追加した内容を解説していきます。
- 一番上の
before_action ...
では、Applicationコントローラが読み込まれる前に 、下のconfigure_permitted_parameters
というメソッドを、 deviseコントローラ を使うときにのみ実行させるための記述です。
-
configure_permitted_parameters
メソッドでは、ユーザー登録・編集フォームで受け取ったユーザー名をデータベースへ保存できるようにストロングパラメーターを設定します。
フォーム画面を修正
あとはユーザー登録・編集フォームにユーザー名の入力を追加します。
見た目は整えてないですが、ユーザー名が入力できてデータベースに保存できれば完璧です!
- app/views/devise/registrations/new.html.erb
.
.
.
<%= form_for(resource, as: resource_name, url: registration_path(resource_name)) do |f| %>
<%= render "devise/shared/error_messages", resource: resource %>
<div class="field">
<%= f.label :name %>
<%= f.text_field :name, class: "xxx" %>
</div>
<div class="field">
<%= f.label :email %><br />
<%= f.email_field :email, autofocus: true, autocomplete: "email" %>
</div>
.
.
.
さいごに
name カラムの追加とストロングパラメーターの設定ができるようになって、色々してみたくなったので、次はユーザーのプロフィール画像を設定したり、いろんなテーブルと関連付けたりして遊んでみます。
色々やってみた結果を記事にしてみたいと思います。