Scroll

「常に新しい技術に目を向けること」
「既存の技術をより深堀りすること」

カテゴリ:Laravel
タグ:,,,,
公開日:2021/06/30(水)
最終更新日:2021/07/01(木)

Laravelのフォームマスターに、俺はなる!

みなさまこんにちは。
Laravel歴4ヶ月の初心者、うどんです。
ひょんなことからITdept.配属になって早くも半年。
といってももともとはWEB担だったのではじめはITらしいことをせず、最近になってITっぽいことをはじめだした人間です。

そんな私が最初に担当したシステムがWEBで馴染みもあったこともあり、かんたんなフォームを扱うものだったのですが、調べれば調べるほど、いろいろと出てきまして・・・。
知らないことが大量発生するわけですよ。

ということで、自分の備忘録をかねて、いろいろ記録していくことにしました。

そもそもの環境

私が実行しているのはLaravel6.2のバージョンになります。
バージョンの違いによって非対応といったものがあると思うのですが、そちらは予めご了承ください。

ユーザが見える(操作する)側のフォームのパターン

フォームを作るためにできるのは大きくは2パターン。

  1. HTMLタグで作成する
  2. FORMブレードで作成する

それぞれ解説していきます。

HTMLタグで作成する

もともとWEB担当だったのでHTMLタグでフォームを作る方法には慣れ親しんでいたのですが、actionがPOSTの場合、少し注意しなければならない点がありました。

というのがLaravelのPOSTアクションではCSRF対策が必須!
そのため、送信するForm内には以下のどれか等を入れる必要があります。

  1. @csrf、もしくは{{ csrf_field() }}

  1. <input type="hidden" name="token" value="<?php echo $_SESSION ["TOKEN"] ?>">

ちなみにすっごい初心者なんで、先輩のシステム内で見た<meta name=”csrf-token” content=”{{ csrf_token() }}”>入れてたらいらんのかなと思ったんですが、そんなん関係なく必要でした。
↑これはAjax通信で必要になるやつみたいですね。

FORMブレードで作成する

LaravelにはFORMブレードというものが存在しています。
FORMブレードとは?といった方のために簡単に紹介すると、{{ Form::open([‘url’ => ‘/’]) }}ではじまり、{{ Form::text(‘name’, null, [‘placeholder’=>’名前を入力’]) }}等でinput要素を作り、{{ Form::close() }}で終わらせるといったものです。

この記事がとても参考になりました。

【Laravel】初めてのフォーム作成
https://qiita.com/manbolila/items/b364088e821f4c946229

上記の記事でも書いてあるのですが、FORMブレードを使用する際は『laravelcollective』が必須となるのでご注意ください。

受け取ったrequestをvalidateするパターン

フォームから送信されたデータをvalidateするのには3つの方法があります。

  1. controllerに直書きする
  2. formrequestを作る
  3. ruleを作って1.2.に入れる

controllerに直書きする

Controllerで直書きする方法はRequestを受け取ったメソッド内で、「$request->validate([バリデーション内容],[エラーメッセージ]);」を入れることで使うことができます。

一例をちゃんと書くなれば、Controller内に以下を入れることで実行できます。

  1. public function store(Request $request){
  2.         $request->validate([
  3.             'name' => 'required',
  4.             'mail' => 'required',
  5.         ],
  6.         [
  7.             'name.required' => 'ユーザー名を入力ください。',
  8.             'mail.required' => 'メールアドレスを入力ください',
  9.         ]);
  10.         //ここにはvalidate後の処理を書く
  11.         return redirect()->route('mainpage')->with(['complete' => '登録が完了しました。']);
  12.     }

こんな感じをイメージしてもらったらいいかと思います。

formrequestを作る

同じvalidate内容を数回使う場合、FormRequestを作っておくとめちゃくちゃラクになります。

FormRequestを作る際は「php artisan make:request 名前」をLaravelのターミナル内で実施し、生成されたFormRequestを書き換えていくと完成します。

この記事がとても参考になりました。

Laravel : FormRequestクラスを使ってValidation(MyMemo)
https://qiita.com/daisu_yamazaki/items/e44d4b744d9d5f9bc8b3


ちなみにFormRequestはrulesの記述でいきなりreturnで返すのではなく、以下のようにifで読み込む要素を指定すると使い回すことができます!

  1. public function rules()
  2.     {
  3.         $rules = [];
  4.         $rules = [
  5.             'name' => 'required',
  6.             'mail' => 'required|email|confirmed',
  7.         ];
  8.         if ($this->has('tel')) {
  9.             $rules['tel'] = 'required';
  10.         }
  11.         return $rules;
  12.     }

この場合だと名前とメールは必須ですが、電話番号は入力欄がある場合だけvalidateされるってことですね。

ruleを作って1.2.に入れる

ほかのシステムでも使いまわしたいvalidateってありますよね。(例:半角英語表記)
そういった際にはruleを作ってしまっておくと、別システムの際は同じルールのファイルをコピペするだけで、使い回すことができて時短になります。

ただこのruleを作って使う場合は、作ったあとに1.か2.のパターンでruleを追加して使う必要があるのでお忘れなく。

この記事がわかりやすいです。

【laravel】ruleオブジェクトによる検証ルールの追加
https://qiita.com/gone0021/items/7374293c270a99bbf6d8

CRUD処理のパターン

CRUD処理に対しては2パターン。
DBクエリを使うか、Eloquentを使う。

DB::table(‘users’)->insert(内容)であるかMDL::create(内容)であるかって感じですね。
これに関してはどちらもほぼ一緒であり、特記できるようなことがないので割愛します。

その他フォームのときにしたくなること

私が今回アホほど調べたこと。

それはフォームって入力して送信したあと、ブラウザの戻るで押したら履歴残ってたらまた送信できちゃうじゃないですか。
なんでそんなのを発生させたくなかったんで、ちょっと調べたとき
Sessionをクリアしたり、トークンの再発行でできると思ったんですが、これが同じページにリダイレクトしてたら効かないことがわかりました。

え、じゃあどうしよ?
と思い調べたらそもそもまずなんでこの表示があるのかを調べると
フォームに下記を加えたら大丈夫なことがわかりました。

autocomplete=”off”

ですが、これ入れると、自動予測機能はもちろん機能しなくなるんですよね。
一度しか実行されないユーザー登録側とかはこれでもいいと思うんですが、社内システムで同じようなこと繰り返すことがあるフォームにはこれではなく、ページが表示される際に一度リセットがかかるよう処理(jQuery)を加えました。

  1. //ブラウザバックでフォーム初期値
  2.     $(window).on('pageshow', function() {
  3.         let form_num = $("form").length;
  4.         for (let i = 0; i < form_num; i++) {
  5.             $("form")[i].reset();
  6.         }
  7.     });

(↑ちなみにこのコードはページ内に複数のFormがあることを想定して作ってます。)

この方法でブラウザバックで戻った際には履歴が消されているので2重送信の可能性はないですし、フォームの履歴入力ができるので同じ内容を入力することもできる!
やりたい形になりました。

まとめ

初Laravelで初フォーム作りで多次元配列を扱ったりもしたのでエラーを発生させまくったりといろいろと苦戦したのですが、なんとか形になって本当によかったです。
これからシステム制作でフォーム制作が発生しても怖くないので、フォームマスター(自称)と名乗ってみたいなと思います。

それではまた!

この記事を書いた人:うどん
YUKIと日本酒と電化製品とカメラと水族館。


シェアのご協力をお願いいたします!

カテゴリー

アーカイブ