Laravel によるコメント掲示板の開発

投稿内容を検証する

データベースでの comments テーブルの構造は database/migrations/yyyy_mm_dd_hhmmss_create_comments_table.php というマイグレーションファイルで定義しました．title フィールドには最大255文字まで格納できますが，それ以上の長さの文字列は格納できません．また，title や body のフィールドが空白であるような投稿を受け付けても問題になるでしょう．したがって，フォームに入力された内容をコントローラで検証し，問題があればエラーメッセージを表示させるような機能を実装します．

Laravel のコントローラには validate() という入力内容を検証するメソッドが準備されているので，これを利用すれば簡単な検証を実装可能です．具体的には CommentsController の store 関数に次のような内容を追加すると良いでしょう．なお，テストを行いやすいように title を最大10文字に設定しています．手動のテストで動作を確認できたら，たとえば140文字など任意の値に変更すると良いでしょう．

app/HTTP/Controllers/CommentsController.php（抜粋）
public function store(Request $request)
{
    $this->validate($request, [
        'title' => 'required|max:10',  // 入力が必須で，最大10文字
        'body' => 'required'           // 入力が必須
    ]);

    $comment = new Comment();    // インスタンスを生成する
    $comment->title = $request->title; // タイトルをセット
    $comment->body = $request->body;   // 本文をセット
    $comment->save();                  // データベースに登録
    return redirect('/comments');      // リダイレクト
}

上の3行目から6行目のコードを追加しただけで入力内容が検証され，エラーがあった場合にはデータベースに登録されないようになりました．しかしながら，どのようなエラーがあったのかが表示されなければユーザに対して不親切であるし，以前に入力していた文字列が消えてしまうのも使い勝手が悪いので，そのあたりを改善します．

このために，まずはビューのフォームにエラー内容を表示させるためのコードを記載します．index.blade.php のフォームを次のように変更します．具体的には，エラーがあるときだけエラーの内容を表示するようにしています．

resources/views/comments/index.blade.php（抜粋）
<h1>コメント投稿</h1>
<div>
    <form method="post" action="{{ route('comments.store') }}">
        @csrf
        <p>
            <label for="title">Title: </label>
            <input type="text" name="title" id="title" value="">
            @if ($errors->has('title'))
                <span class="error">{{ $errors->first('title') }}</span>
            @endif
        </p>

        <p>
            <label for="body">Body: </label>
            <textarea name="body" id="body" rows="4" cols="50"></textarea>
            @if ($errors->has('body'))
                <span class="error">{{ $errors->first('body') }}</span>
            @endif
        </p>
        <p>
            <input type="submit" value="投稿">
        </p>
    </form>
</div>

タイトルに11文字を入力し，本文を空欄にして投稿するとエラーが表示されました．しかしながら，入力していた文字列が消えてしまう設計は不親切です．

エラーがあった場合に入力していた文字列を表示するには old ヘルパを利用します．

resources/views/comments/index.blade.php（抜粋）
<h1>コメント投稿</h1>
    <div>
        <form method="post" action="{{ route('comments.store') }}">
            @csrf
            <p>
                <label for="title">Title: </label>
                <input type="text" name="title" id="title" value="{{ old('title') }}">
                @if ($errors->has('title'))
                    <span class="error">{{ $errors->first('title') }}</span>
                @endif
            </p>

            <p>
                <label for="body">Body: </label>
                <textarea name="body" id="body" rows="4" cols="50">{{ old('body') }}</textarea>
                @if ($errors->has('body'))
                    <span class="error">{{ $errors->first('body') }}</span>
                @endif
            </p>
            <p>
                <input type="submit" value="投稿">
            </p>
        </form>
    </div>

上のように old ヘルパを利用することで，エラーの際に入力していた文字列が表示されるようになりました．また，タイトルや文字列が空ではなく，空白文字（スペース記号）だけが入力された場合にどのような動作になるのかはぜひチェックしてください．

目次に戻る

« 戻る次へ »