ユーザー登録フォーム | rails チュートリアル 11

7.2 ユーザー登録フォームの勉強メモ

サインアップページの修正

http://localhost:3000/signupこれらのページを修正していく。

form_forを使用する

form_forとあるが、別なところでは、form_with というのが使われていた。

form_for form_withの違い

form_for は、モデル(DB)と密接に紐付いたフォーム、
form_tag は、モデルがない(DBを使わない)などの簡易的なフォーム用、
これらは、古いやりかた。
form_with は rails5.1 以降で、↑を統合した書き方のようです。
2.8 form_forとform_tagのform_withへの統合

new.html.erbを修正

「app/views/users/new.html.erb」を以下のように修正する。

<% provide(:title, 'Sign up') %>
<div class="page_mainvisual">
  <div class="container">
    <h1>New User</h1>

    <%= render 'form', user: @user %>

    <%= link_to 'Back', users_path %>

  </div>
</div>

_form.html.erbを読み込んでいるのがわかったため、そのファイルも修正する。

<%= form_with(model: user, local: true) do |form| %>
  <% if user.errors.any? %>
    <div id="error_explanation">
      <h2>
        The form contains <%= pluralize(user.errors.count, "error") %>
      </h2>
      <ul>
      <% user.errors.full_messages.each do |message| %>
        <li><%= message %></li>
      <% end %>
      </ul>
    </div>
  <% end %>

  <table>
    <tbody>
      <tr>
        <th><%= form.label :name %></th>
        <td><%= form.text_field :name, id: :user_name %></td>
      </tr>
      <tr>
        <th><%= form.label :email %></th>
        <td><%= form.text_field :email, id: :user_email %></td>
      </tr>
      <tr>
        <th><%= form.label :password %></th>
        <td><%= form.password_field :password, id: :user_password %></td>
      </tr>

      <tr>
        <th><%= form.label :password_confirmation, "Confirmation" %></th>
        <td><%= form.password_field :password_confirmation, id: :user_password_confirmation %></td>
      </tr>
    </tbody>
  </table>

  <div class="actions">
    <%= form.submit "Create my account", class: "btn btn-lg btn-primary" %>
  </div>
<% end %>

コントローラーも修正

このままでは、以前以下のコマンド

$ rails generate scaffold User name:string email:string

で、作成したままのコントローラーでは、passwordはdbに保存されないため、「users_controller.rb」を修正をする。

    def user_params
      params.require(:user).permit(:name, :email, :password,
                                   :password_confirmation)
    end

「:password」と、「:password_confirmation」が増えていることに注目。

flash

html.erbの修正

自動で生成されたファイルのnoticeの記述は、それぞれの.html.erbに、以下のように 個別のhtmlが記述されているため、共通ファイル化を行う。

# 変更前
<p id="flash"><%= flash %></p>

# 変更後
<%= render '/_parts/global/flash' %>
<%- if flash -%>
  <div id="flash" class="container">
    <%- flash.each do |message_type, message |-%>
      <div class="box_flash box_flash_<%= message_type %>"><%= message %></div>
    <%- end #each -%>
  </div>
<%- end #if -%>

users_controller.rbの修正

コントローラの記述も、自動生成のものは、複数のstyleには対応させにくいため、チュートリアルのように、記述を変更する。

# 変更前
  def create
    @user = User.new(user_params)

    respond_to do |format|
      if @user.save
        format.html { redirect_to @user, notice: 'User was successfully created.' }
        format.json { render :show, status: :created, location: @user }
      else
        format.html { render :new }
        format.json { render json: @user.errors, status: :unprocessable_entity }
      end
    end
  end

# 変更後
  def create
    @user = User.new(user_params)

    respond_to do |format|
      if @user.save
        format.html {
          redirect_to @user,
          flash: { success: 'User was successfully created.'}
        }
        format.json { render :show, status: :created, location: @user }
      else
        format.html { render :new }
        format.json { render json: @user.errors, status: :unprocessable_entity }
      end
    end
  end

herokuにup

heroku自体がsslなので、作成しているappもssl化が可能

「Procfile」 というファイルを「Gemfile」と同じ階層に作成し、内容を以下のようにする。

web: bundle exec puma -C config/puma.rb

「config/environments/production.rb」を修正する。

config.force_ssl = true
# コメントアウトを外す or 追記

herokuにpush

$ git push heroku master
$ heroku run rails db:migrate

※ migrate直後に本番を動かしてみたら、ユーザー登録後のページがエラーで開けなくなった。。。
が、しばらくしたら、動くようになった。なぜだろう。。

次回は、第8章 基本的なログイン機構を勉強する

コメント

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

内容に問題なければ、下記の「コメントを送信する」ボタンを押してください。


  1. KATOON.NET
  2. TRASH
  3. ユーザー登録フォーム | rails チュートリアル 11