問い合わせページからメール送信 ~Laravel7入門~

laravel
この記事は約10分で読めます。
スポンサーリンク

Laravel7のプロジェクトに、問い合わせフォームを作って、問い合わせ内容をメールで送信する手順を説明します。

この記事に従って作業を進めると、下図のようなお問い合わせページを作成できます。

スポンサーリンク

前提となる環境

今回ベースとなる環境として、Laravelのバージョン7を使います。

ベースとしては、下リンクのLaravel入門に従って作業をしているプロジェクトを使っています。

が、しかし、まだ説明していない項目が多いため、必要な部分は説明いたします。

お問い合わせページとメール送信機能の追加手順

では、説明いたします。

追加する機能の概要

まず、ざっと、追加する機能を説明いたします。

  • お問い合わせページを追加
    • ページURLは、/contact
    • お名前、メールアドレス、質問内容を入力
    • ログイン機能を追加したときのlayoutファイルを使用
  • お問い合わせ内容をメールで送信
    • ポストメソッドの宛先URLは、/contact_send とする。
    • PagesController コントローラ内で処理する
    • データベースへの保存はしない
    • メールを、管理者と問い合わせした人に送信する

作業手順の説明

手順1. ルート設定

まず、ルート設定ファイルに以下の2行を追加します。

対象ファイルは、 routes\web.php です。

追加後、下図のようになります。

コードの意味ですが、/contact にGETメソッドでアクセスすると PagesControllerコントローラクラスのcontact()メソッドを呼び出します。そしてルート設定に「contact」という名前を付けています。

同様に、/contact_send にPOSTメソッドでアクセスすると、同じPagesControllerクラスのcontact_send()メソッドを呼び出します。このルート設定には「contact_send」という名前を付けています。

手順2. コントローラにcontactメソッド追加

では、次に、PagesControllerコントローラにcontactメソッドを実装します。

これは問い合わせフォームを作るだけなので一瞬ですね。

でも、PagesControllerコントローラをまだ作ってなかったら、まず作って下さい。

laravelプロジェクトのフォルダで、

を実行すると、PagesControllerが作られます。

コントローラーファイルに、contactメソッドを下リストのように追加します。

pages/contact.blade.php ビューを呼び出す処理となります。

手順3. お問い合わせページのビューを作成

では、お問い合わせページを作りましょう。

routes/viewフォルダの中にpagesフォルダを作り、その中にcontact.blade.phpファイルを作成します。

下記のように、@section(‘content’) から @endsection で囲まれたコードを使ってビューファイルを作成してください。

最初にlayouts/app.blade.php テンプレートを呼び出しています。

このテンプレートファイルは、ログイン機能を実装していれば自動で作成されています。

上記のコードではフォームにpostメソッドを使っています。

フォーム内の action=”{{route(‘contact_send’)}}”は、「ルート設定ファイルweb.phpでcontact_sendと名前をつけた宛先に移動する」という意味です。

このように、Laravel内ではURLはroute()関数を使って指定できます。

手順3. メール送信クラスの作成

laravelではメール送信するためにMailable(メイラブル)クラスを作成します。

Mailableとメール送信の方法について詳しくは公式マニュアルに載っています。

まず今の段階では、メールを送るために必要ということだけ覚えておけばよいです。

Mailableクラスは、artisan makeコマンドで作成できます。

と入力してContactSendingクラスを作ります。

・・・名前はContactFormのほうがよかったかもしれません。

ただ、この記事ではContactSending という名前で進めさせてもらいますね ^^;

コマンド実行後、 app\Mail\ContactSending.php というファイルが作成されます。

このファイルとMailファサードのtoメソッド使って、メールを送信します。次にこの手順を紹介します。

Mailファサードについても上で紹介した公式マニュアルに載っていますので、実行したい処理がある場合、参照してみてください。

 手順4. メール送信処理の作成

では、手順3で作成したメイラブルクラスを使用して、メール送信処理を作成していきます。

まず、設定ファイルにメールサーバーの情報を入力しましょう。

ここでは、xserver のメールアカウントとSMTPサーバーを使ってメール送信する方法を紹介します。

環境設定ファイル .env

環境設定ファイル .env に以下の設定をしましょう。

MAIL_MAILER から MAIL_FROM_NAME までは、もともと項目が .envに用意されています。

MAIL_ADMIN は、お問い合わせメールの宛先として、追加します。

これらの設定は パソコンのメールソフトでSMTPサーバー設定をするときと同じような内容になります。

テストアプリでは下図のような感じで設定してます。${APP_NAME} は、.envファイルの先頭で設定しているアプリの名前です。

Laravel7でローカル環境を使用している場合は、.envファイルの情報を設定した後、下記を実行してサーバーを再度起動してください。

XserverでのMAIL_HOST確認方法

もし MAIL_HOSTの情報がどこにあるか分からない場合。
Xserverをご利用なら、下記を参考にしてください。

僕もXserverです。

①Xserverのサーバーパネルにログインする

②【メールアカウント設定】をクリック

③使用するドメインの【選択する】をクリック

④【メールソフト設定】タブをクリック

⑤Mail_HOST情報が表示される

PagesControllerのcontact_send メソッド

次にコントローラーファイルPagesController.phpを編集していきます。

MailファサードとContactSendingメイラブルクラスを使用するので、use 文を記述します。

記述後は下図のような感じになります。

contact_sendメソッドには、下リストのコードを実装してください。

コメントでも書いていますが、入力データのバリデーションを行った後、MailファサードとContactSendingクラスを使用して、メールを2通送っています。

一回に複数の宛先にも送付できますが、この例では、2通に分けて送っています。

※この辺りもマニュアルに記述あります。

Mail:: の部分がMailファサードになります。toメソッドで宛先を指定して、さらに -> 演算子でsendメソッドを呼び出しています。

sendメソッドでは、ContactSending クラスで作成するメール内容を実際に送信しています。

 

最後に、トップページにリダイレクトして、成功メッセージを表示させています。

次にContactSending クラスを作っていきましょう。

ContactSendingメイラブルクラスの作成

app/Mailフォルダの中のContactSendingは以下のように実装してください。

骨組みはすでに作られていると思いますので、変更点について説明します。

この部分は、メール文面に表示したいデータを$dataとして受け取っています。

$this->data がこのクラス内のデータで、constructメソッドの引数が受け渡される仮引数になります。

メール内容を作成してreturn でデータを返答しています。まず、メールのテンプレートとして viewを使っています。

resources\views\mail\contact.blade.phpをビューとして指定していますので、後でこのファイルも作りましょう。

->演算子(アロー演算子)でつなげて、withメソッドで、ビューにデータを渡しています。キーが’data’なのでviewの中で$data という名前で参照できます。

さらに、アロー演算子で subjectメソッドにつなげています。メールの表題を設定しています。

メール文面のビューの作成

メール文面は、 resources\views\mail\contact.blade.phpを指定しています。

このファイルを作っていきます。

viewsフォルダ内にmailフォルダを作り、この中にcontact.blade.phpファイルを作成します。

ファイルは、以下のように作りました。

上記はhtmlを使用していますが、textメールでも作成できます。上で掲載の公式マニュアルで「平文テキストメール」の項をご参照ください。

$data で渡されたデータを表示しています。body 部分だけ、改行を表示させるために、nl2br や htmlspecialchars 関数を使っています。

動作確認

メール送信にSMTPサーバーを使っているので、ローカル環境でも本番環境でも動作します。

ここではデプロイ後の本番環境での動作結果を紹介しますね。

まず、/contact にアクセスします。

お名前、メールアドレス、内容を入力し「問い合わせ」ボタンをクリックします。

するとメール送信後、以下のトップ画面にリダイレクトされます。トップ画面を作っていなければ、「Laravel」と大きく表示されるデフォルトのトップ画面が表示されると思います。

実際に下図のようなメールが届きました。

補足

補足1: バリデーションエラーの表示

バリデーションエラーの時のエラー表示ですが、カスタマイズしています。

layouts ファイルをいじってますので、興味がありましたら、こちらをご覧ください。(「ビューにメッセージ表示処理を追加」の項目)

 補足2:グローバルメニューに「お問い合わせ」を追加

メニューに「お問い合わせ」を追加するときは、 resources\views\layouts\app.blade.php を編集します。「Right Side Of Navbar」  のul タグを探し出して、中に、liタグを追加しましょう。

追加後は下図の赤枠のようになります。

まとめ

Laravel7 でお問い合わせページを作り、メールを送信する手順を紹介しました。

この記事で紹介しているのは基本部分です。

もしご紹介している以外のことを実装したい場合には、記事の中で紹介しているマニュアルも見てみてください。

複数の宛先に送ったり、テキストメールを送ったり、あと、ファイルを添付したりと、いろいろできますよ。

 

===目次===

  1. laravelはPHPで動くフレームワーク ~laravel入門01~
  2. laravelでログイン機能付きサイトを作ってみよう、作成予定のWebアプリケーションの概要と作業手順の概略~laravel入門~
  3. 開発環境のインストール
    1. XAMPP
    2. VS code
    3. Git for Windows
    4. SourceTree
  4. laravelインストール
    1. composerインストール
    2. laravel本体インストール
    3. laravelのUIインストール
    4. node.jsインストール
  5. アプリ作成
    1. データベース設定
    2. ログイン機能追加
      1. npmインストール
      2.  css, jsコンパイル
    3. Topページ作成
    4. Aboutページ作成
    5. 問い合わせページ作成
      1. 問い合わせページからメール送信 ~Laravel7入門~
    6. Blog機能作成
      1. Model作成と一緒にmigrationファイルも作る。~Laravel7入門~
      2. リソース コントローラを自動生成して CRUD のうち一覧表示 indexアクションを実装する ~Laravel7入門~
      3. リソース コントローラで、詳細表示 showアクション を実装する ~Laravel7入門~
      4. リソースコントローラで新規作成:create, storeアクション を実装する~Laravel7入門~
      5. bladeテンプレートエンジンでタグを無視させつつ、改行を表示させる方法 ~Laravel7入門~
      6. リソースコントローラで更新:edit, updateアクション を実装する~Laravel7入門~
      7. リソースコントローラで削除:destroyアクション を実装する~Laravel7入門~
      8. 投稿にカバー画像を追加する ~Laravel7入門~

この記事が気に入ったら
いいね ! しよう

コメント

  1. free より:

    こんにちは。こちらを参考に実装させていただいています。
    contact_sendのビューファイルを作る必要はありますか?

    • わかばやし より:

      freeさん、質問ありがとうございます。
      ビューファイルは必要ないですよ。
      contact_sendの処理(contact_sendメソッド)は、最後、return redirect(‘/’)->…. で終わってますね。
      これは、URLのパス’/’ にリダイレクト、つまり、’/’にアクセスし直す処理になります。
      なので、ブラウザのURL蘭も、問い合わせページが /contact だったのに対して、「問い合わせ」ボタンを押したあと、バリデーションエラーにならずメール送信したあとは、’/’ になります。

      contact_sendメソッドの最後を、return view(‘xxxx’); とする場合は、ビューファイルが必要となります。その場合は、URL蘭が /contact_send のまま、return view(xxx) で指定したビューファイルが表示されます。