お問い合わせフォームを作成し、Gmailと連携が出来るように実装しました。デザインはtailblocksを使用しています。tailblocksはヘッダーや本文のレイアウトやお問い合わせフォームなどのデザインがテンプレートとして用意されており、気軽に利用出来るので便利です。今回はtailblocksのテンプレートを利用してお問い合わせフォームを作成しましたので、その使い方も含めてまとめました。

参考記事：ウツボウTECH

まずは入力ページを作成し、テンプレートを表示させます。デザインはtailblocksを使用します。

ルーティングの設定

routes/web.php

1. Route::get('contact', [MailController::class, 'create'])->name('mail.index');

MailControllerを新規で作成しました。

Controllers/MailController.php

1. class MailController extends Controller
2. {
3.     /**
4.      * Display the login view.
5.      */
6.     public function create(): View
7.     {
8.         return view('mail.index');
9.     }

手順2：　tailblocksの使い方

手順3： バリデーションの実装

authorizeメソッドは認証しているかどうかチェックしたい時に使用する。デフォルトではfalseになっているので403エラーになってしまう。trueを返すか、使用しないのであれば削除する。

1. <?php
3. namespace App\Http\Requests;
5. use Illuminate\Foundation\Http\FormRequest;
7. class MailRequest extends FormRequest
8. {
9.     /**
10.      * Determine if the user is authorized to make this request.
11.      *
12.      * @return bool
13.      */
14.     public function authorize()
15.     {
16.         return true;
17.     }
19.     /**
20.      * Get the validation rules that apply to the request.
21.      *
22.      * @return array<string, mixed>
23.      */
24.     public function rules()
25.     {
26.         return [
27.             'name' => 'required|max:20',
28.             'email' => 'required|email|max:100',
29.             'message' => 'required|max:500',
30.         ];
31.     }
32. }

バリデーションにnameとemailとmessageに対してrequire(必須)とmax(上限)のチェックを指定した。

1.  /**
2.      * Display the login view.
3.      */
4.     public function confirm(MailRequest $request): View
5.     {
6.         return view('mail.confirm', ['contents' => $request->validated()]);
7.     }

第一引数にMailRequestを指定することで、MailController.phpが呼ばれる前にMailRequest.phpでチェックを行なっている。

パラメーターを受け取る場合は以下のようにする。

1. $params = $request->validated();

手順4： バリデーションメッセージを日本語で表示させる

resources/lang/ja/validation.php

1. attributes' => [
2.         'name' => '氏名',
3.         'email' => 'メールアドレス',
4.         'message' => '本文',
5. ],

そのままだとバリデーション表示時にnameやemailと表示されるので、keyに対してそれぞれ日本語を指定する。

記事一覧に戻る

プロフィールに戻る