0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

Ruby on Rails [学習記録-第5章-]

Posted at

投稿画面の作成

  • まず最初にどんなリクエストをしたらどんなアクションが動くかを設定する。
  • routes.rbを以下のように追記する。
routes.rb
  Rails.application.routes.draw do
    get   'apps'      =>  'apps#index'     #ツイート一覧画面
    get   'apps/new'  =>  'apps#new'       #ツイート投稿画面
  end
  • ルーティングができたのでコントローラにnewメソッドを追加していく。
apps_controller.rb
class TweetsController < ApplicationController

  def index
    @apps = App.all
  end

  def new
  end

end
  • 次に投稿用のビューファイルを用意する。
new.html.erb
<div>
  <form action="/test" method="post">
    <h3>
      投稿する
    </h3>
    <input placeholder="Nickname" type="text" name="name">
    <input placeholder="Image Url" type="text" name="image">
    <textarea cols="30" name="text" placeholder="text" rows="10"></textarea>
    <input type="submit" value="SENT">
  </form>
</div>
  • Railsではセキュリティの観点から、HTMLのformタグだけで作成したフォームを使用することは推奨されない。
  • 通常、Railsでフォームから情報を送信するためにはform_tagを始めとするヘルパーメソッドを使用する。
  • form_tagの第一引数はパスを表し、第二引数はhttpメソッドを示す。
new.html.erb
<div>
  <%= form_tag('/test', method: :post) do %>
    <h3>
      投稿する
    </h3>
    <input placeholder="Nickname" type="text" name="name">
    <input placeholder="Image Url" type="text" name="image">
    <textarea cols="30" name="text" placeholder="text" rows="10"></textarea>
    <input type="submit" value="SENT">
  <% end %>
</div>

投稿機能の実装

  • 前述の通り、テーブルにレコードを保存するためにはcreateメソッドを利用するのでした。
  • あるリクエストで動かしたアクションの中にこのコードが入っていれば、ルーティングを設定しリクエストによってそのアクションを動かすことでテーブルにレコードを保存することができそう。
apps_controller.rb
class TweetsController < ApplicationController

  def index
    @tweets = Tweet.all
  end

  def new
  end

  def create
    Tweet.create(name: "", image: "", text: "")
  end

end
  • ツイートは入力画面から情報としてサーバーに送信されるので、postメソッドでルーティングを設定する。
routes.rb
Rails.application.routes.draw do
  get   'apps'      =>  'apps#index'     #ツイート一覧画面
  get   'apps/new'  =>  'app#new'       #ツイート投稿画面
  post  'apps'      =>  'apps#create'    #ツイート投稿機能
end

フォームに入力した情報をコントローラで取得

  • ユーザーがフォームに入力した値は、コントローラ内ではparamsという変数に入っている。
  • paramsはハッシュオブジェクトと考える。
  • paramsメソッドを使用する際にはparams[:キー名]という形で使用。
  • 以下のようにコントロールファイルを変更。
apps_controller.rb
class TweetsController < ApplicationController

  def index
    @tweets = Tweet.all
  end

  def new
  end

  def create
    Tweet.create(name: params[:name], image: params[:image], text: params[:text])
  end

end
  • ツイートを新しく作成するための実装が終了しました。しかし、現状ではパラメーターにどんな情報が含まれていても受け取れる状態になっているため、セキュリティの観点から好ましくない状態にある。
  • そこでストロングパラメータを設定する。
apps_controller.rb
class TweetsController < ApplicationController

  def index
    @tweets = App.all
  end

  def new
  end

  def create
    App.create(app_params)
  end

  private
  def app_params
    params.permit(:name, :image, :text)
  end

end
  • createアクションがリクエストされると、11行目の処理が行われる。
  • createメソッドの引数が(tweet_params)となっているので、15行目のtweet_paramsメソッドが呼び出される。
  • ということは、この部分に入る値はtweet_paramsメソッドの返り値ということになる。
  • permitというメソッドは、ビューから送られてきた情報のハッシュであるparamsの中から:name, :image, :textというキーとそのバリューのセットだけを残した新たなハッシュを生成している。
  • このようにして特定のパラメータのみを受け渡す仕組みであり、app_paramsの部分がストロングパラメーターである。

投稿完了のビューファイルを作成

  • 最後に投稿完了画面のビューファイルを以下のように作成。
create.html.erb
<div class="contents row">
  <div class="success">
    <h3>
      投稿が完了しました。
    </h3>
    <a class="btn" href="/tweets">投稿一覧へ戻る</a>
  </div>
</div>
0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?