Form Mailに取得したメールアドレスを割り当てます。
DrupalやWordPressなどのCMSでWEBサイトを構築していくと、閲覧者からの問い合わせをメールで受ける為に、Form Mailを設置するのが一般的で私も使用しています。WebサイトにMail toで直接メールアドレスを提示していると、悪意のあるBotなどで、アドレス収集され、迷惑メールが大量に送られて来たり、場合によってはセキュリティーにも影響が出てしまいます。
それだけではなく、問い合わせ内容や質問内容を、テンプレートの形で提示出来るので、閲覧者が問い合わせをしやすくなり、メールを受ける側も、質問内容を整理した状態で受けられます。この事で折り返しの回答がしやすくなります。このような悪意のあるBotなどの影響を受けない為や、閲覧者が問い合わせをしやすくする為にForm Mailを設置します。
WordPressでは、Contact7やWpformなどのプラグインが用意されており、非常に簡単にWEBサイトに設置出来るので、問い合わせメールとして使用されています。Drupalは標準でContact Formの機能が搭載されています。
今回、Contact Formを設定し、AWSで取得したドメインのメールアカウントでフォームメールのテストを行います。テストを行なった際、送信エラーが出てしまいメールが送信出来ないので、原因を特定し、フォームメールで使用可能とするため以下のプロセスを行なっています。
1.Drupalデフォルト状態でのテスト
- Contact Formを設定
- AWSで取得したドメインのメールを割り当て
- reCAPTCHAの設定
- フォームメールのテスト
- メール送信エラー
- 原因追及
2.SESのSMTPを使用してのテスト
- SMTPの設定
- SESのSMTPの設定
- フォームメールのテスト
- メール送信エラー
- 原因追及
3.アドレス相違への対応
- ユーザーのメールアドレスとフォームメールに設定したメールアドレス相違によるエラー
- ユーザーのメールアドレスを変更
- フォームメールのテスト
- 問題解決
原因が特定出来て、利用可能となりましたが、原因は単純で、私のミスでユーザー登録を行なったメールとフォームメールの受け先に割り当てたメールが異なっていたためにメール送信出来なかった事が原因でした。
その事に気が付かず、Drupalのデフォルトのメール送信を使わず、AWSのSESとSMTPを設定を行なっています。怪我の功名とも言えますが、現在、フォームメールはSESのSMTPを経由して送られる事により、通常のメール割り当てより、レスポンスが良くなっています。
今回の記事は、フォームメールのテストからSMTPモジュールの設定とSESの設定、ユーザー登録アドレスとフォームメールアドレスの相違の訂正で送信エラーを解消するまでをまとめています。
今回、AWSにてドメインを取得し、取得したドメインのメールアカウントを設定しています。設定したメールアカウントでコンタクトフォームからの問い合わせメールを受けるようにコンタクトフォームの設定をして行きます。
- Drupalの管理画面にログイン
- ホーム > 管理 > サイト構築 > コンタクトフォーム { / / コンタクトフォームを選択します }
- 以下の画面が表示されるので”お問い合わせ”の”編集”をクリックします。
ホーム > 管理 > サイト構築 > コンタクトフォーム
ホーム > 管理 > サイト構築 > コンタクトフォーム | |||
+コンタクトフォームの追加 | |||
フォーム | 受信者 | 選択済み | 操作 |
お問い合わせ | info@my-domain.com | はい | 編集 |
ウェブサイトフィードバック | user@example.com | いいえ | 編集 |
パーソナルコンタクトフォーム | 選択したユーザー | いいえ | フィールドの管理 |
お問い合わせの”編集”を選択します。以下の画面が表示されますので必要次項を入力します。
ホーム > 管理 > サイト構築 > コンタクトフォーム > Manage > コンタクトフォームを編集
ホーム > 管理 > サイト構築 > コンタクトフォーム > Manage > コンタクトフォームを編集 | ||||
ビュー | 編集 | フィールドの管理 | フォームの表示管理 | 表示管理 |
ラベル | ||||
お問い合わせ { //コンタクトフォーム名称 } | システム内部名称: { contact } | |||
利用者に分かり易いカテゴリーの名称を入力してください。例: 「サイトへのご意見」「製品情報のご請求」 | ||||
受信者 | ||||
info@my-domain.com { // AWSで取得したメールアカウント } | ||||
例: 'webmaster@example.com' あるいは 'sales@example.com,support@example.com'。複数の宛先を指定するには、メールアドレスをカンマ区切りで入力してください。 | ||||
メッセージ | ||||
{ 利用しないので空白 } | ||||
このフォームの送信後にユーザーに表示されるメッセージ。メッセージを表示しない場合はブランクのままにします。 | ||||
リダイレクトパス | ||||
/ { メール送信後Topページにリダイレクトするので"/"を指定 } | ||||
このフォームの送信後にユーザーがリダイレクトされるパス。例えば、「/about」と入力すると、そのページにリダイレクトされます。スラッシュで始まる相対パスを使用してください。 | ||||
自動返信 | ||||
{ 利用しないので空白 } | ||||
利用者に自動返信したい場合は、そのメッセージを記入してください。 自動返信メッセージを送りたくない場合は、空欄にしてください。 | ||||
ウエイト | ||||
0∨ { -から+までで設定可能であるが、0を選択 } | ||||
フォームの並び順は、ウェイトの軽い (小さい) ものからウェイトの重い (大きい) ものへの順になります。ウェイトが同じ場合は、アルファベット順となります。 | ||||
∨ デフォルトのフォームにする { // チェックを入れる。} | ||||
保存 / 削除 { 保存を選択 } |
必要次項を入力し、保存をしたら
- フィールドの管理 // 追加のフィールドを設定します。
- フォームの表示管理 // フォームの表示管理
- 表示管理 // フィールドの表示項目を任意に設定出来ます。
を設定して行きますが、今回テストなので設定を行いません。
以上の設定を完了すると
https://my-domain.com/contact でコンタクトフォームが表示されます。
DrupalやWordPressなどのCMSでWEBサイトを構成すると、お問い合わせ用のメールフォームや管理画面へのログインフォームに対して、サイト構成が決まっているため、公開していると攻撃や悪意のあるハッキングの可能性が出てきます。Botなどでスパムメールの攻撃や場合によってはログインフォームへのハッキングの恐れがあり、セキュリティ面を考慮すると対策をする必要があります。
連続送信や、不審な送信、不審なログインなどを検知し防ぐツールとしてGoogleが提供するGoogle reCAPTCHAが有名で機能面も優れているので、Google reCAPTCHAの導入をします。
WordPressの場合、Contact7やWpFormなど有名なフォームメールのプラグインは、Google reCAPTCHAの設定がデフォルトで用意されています。Drupalはモジュールを使用しGoogle reCAPTCHAの設定をします。
DrupalでGoogle reCAPTCHAを使用するには2つのモジュールが必要になります。
追加で、v3の認証にv2を使用するのでreCAPTCHAもインストールしています。
BitnamiにSSHでログインし、それぞれをコンポーザーでインストールします。
- CAPTCHAのインストール
$ sudo composer require 'drupal/captcha:^2.0' - reCAPTCHA v3のインストール
$ sudo composer require 'drupal/recaptcha_v3:^2.0' - reCAPTCHAのインストール
$ sudo composer require 'drupal/recaptcha:^3.4'
Google reCAPTCHAを使用するには
https://www.google.com/recaptcha/about/
にログインを行い
- reCAPTCHA v3を使用するドメインの登録
- v2 / v3の選択
- v3のサイトキーとシークレットキーを取得
- reCAPTCHAを使用するドメインの登録
- v2 / v3の選択
- v2のサイトキーとシークレットキーを取得
以上の処理を行います。
V2とV3を選択しますが私はデフォルトでV3を使用しています。違いはV2は常時確認が必要(良く見る指定画像の選択)ですが、V3はホワイトリスト化されていると確認なしで利用出来るようになっています。
DrupalのCAPTCHAの認証が、画像による数字認証と簡単な計算となっていますが、認証をGoogle reCAPTCHA v2の形を取りたいのでv2を使用出来るようにv3とv2それぞれを登録しキーを取得しています。
WEBの管理者のログインは同一IPで同一のユーザーエージェントやクッキーなどであれば2回目以降は本人と認識され確認はしなくて大丈夫になります。IPや端末が変わったりすると確認が必要になります。
Googleのアカウントが必要なので、持っていない方は登録する必要があります。
reCAPTCHA v3はCAPTCHAの機能拡張になっています。基本設定をCAPTCHAで行い、reCAPTCHA v3の設定をCAPTCHA内の機能で行い、認証方式にreCAPTCHA v2の画像認証を行う形になります。
CAPTCHAの設定はreCAPTCHを設置するDrupalの所定のページの基本的な動作を設定します。
ホーム > 管理 > 環境設定 > ユーザー > CAPTCHAの設定
- 標準の設問形式 // reCAPTHA v3(モジュールreCAPTCHA v3提供)
- Charenge Title // reCAPTHA
- 認証問題の説明 // この質問はあなたが人間の訪問者であるかどうかをテストし、自動化されたスパム送信を防ぐためのものです。
- Wrong CAPTCHA response error message // CAPTCHA用に入力された回答が正しくありません。
- 標準のCAPTCHA認証 // 大文字小文字を区別しない認証を選択
- 存続期間 // Omit challenges in a multi-step/preview workflow once the user successfully responds to a challenge.
- 構成を保存
CAPTCHAで読み込むreCAPTCH v3の設定になります。ここでGoogleが発行するサイトキーとシークレットキーを入力します。フォールバックはreCAPTCHA v2を使用するので、reCAPTCHAを指定し、エラーメッセージを確認し、構成を保存します。
ホーム > 管理 > 環境設定 > ユーザー > CAPTCHAの設定 > ReCAPTCHA V3 Settings
- サイトキー // Google reCAPTCHAで発行したサイトキーを入力[40桁の英数字}
- シークレットキー // Google reCAPTCHAで発行したサイトキーを入力[40桁の英数字}
- Local domain name validation // チェックを入れて選択
- Default fallback challenge type // reCAPTCHA (モジュールreCAPTCHA提供)
なし、Math、Image、reCAPTCHAの4択ですがreCAPTCHAを選択 - エラーメッセージ // 不正アクセス防止の為、reCAPTCHの設定を高めに設定しています。お手数をおかけしますが、以下reCAPTCHの指示に従いメッセージ送信下さるよう宜しくお願い致します。
- 構成を保存
reCAPTCH v3の動作の設定になります。botか人かの判断を行うしきい値や、bot判定に出す設問を何にするかを設定します。敷居値を下げると判断を緩和します。1が適正ですが、少し厳しい判定となりますので、0.5から1の間で設定すると良いでしょう。
ホーム > 管理 環境設定 > ユーザー > CAPTCHAの設定 > ReCAPTCHA V3 Actions
+Add reCAPTCHA v3 action
ラベル-//-アクション-//-しきい値-//-Fail challenge-//-操作
reCAPTCH v3 action-//-recaptch_v3_action-//-0.8-//-reCAPTCHA (モジュール recaptcha 提供)-//-編集
- ラベル // reCAPTCH v3 action
- しきい値 // 0.8
- Fallback challenge // reCAPTCHA (モジュールreCAPTCHA提供)
- 構成を保存
reCAPTCH v3の設問にreCAPTCH v2を使用するので、reCAPTCHAの設定を行います。Googleが発行するv2のサイトキーとシークレットキーを入力します。表示される画像認証のスタイルを選択し構成を保存します。
ホーム > 管理 > 環境設定 > ユーザー > CAPTCHAの設定 > ReCAPTCHA
- サイトキー // Google reCAPTCHAで発行したサイトキーを入力[40桁の英数字}
- シークレットキー // Google reCAPTCHAで発行したサイトキーを入力[40桁の英数字}
- Local domain name validation // チェックを入れて選択
- Widget settings
- テーマ // Light(default)
- タイプ // Image(default)
- サイズ // Normal(default)
- 構成を保存
CAPTCHA Pointsの設定で、reCAPTHA v3で認証を行うページ(実際にはフォームID)を指定し有効化します。ここではフォームメールを指定します。デフォルトでは登録されていないのでAdd CAPTCHA PointでフォームID追加し有効化します。
ホーム > 管理 > 環境設定 > ユーザー > CAPTCHAの設定 > CAPTCHA Configuration
+Add CAPTCHA Point
Captcha Point form ID-//-Captcha Point challenge type-//-状態-//-操作
contact_form_001-//-recaptcha_v3/recaptch_v3_action-//-有効-//-編集
Add CAPTCHA Pointをクリックしてフォームメールを追加し、CAPTCHAを有効にします。
追加の際、FormIDの入力と認証の設問(ReCAPTCHA v3)を指定します。
contact_form_001 // WebFormを使い作成したフォームメールのフォームID
// フォームIDを調べるのに一番簡単なのは、フォームメールのHTMLのソース内の送信ボタン近辺に以下の項があります。name="form_id" value= // 以下がこのページのフォームIDとなります。
type="hidden" name="form_id" value=contact_form_001
以上でreCAPTHAの設定が完了します。
この設定を完了したことで指定したお問い合わせのメールフォームにreCAPTHAのアイコンが表示されます。
フォームメールの設定を行い、reCAPTCHAの設定が完了したので、フォームメールとreCAPTCHAが機能しているか検証してみます。フォームメールのページを開きます
- /contactでフォームメールが開きます。
- reCAPTCHAのアイコンは表示されています。
- フォームに必要事項を入力しメール送信をクリックします。
- Google reCAPTCHA v2の画像確認の画面が表示され、指示通り、指定の画像を選択し送信ボタンを押します。
- トップページにリダイレクトされ、ページトップに送信エラーが出てしまいます。
エラーの原因を特定するため、reCAPTCHAの設定を一旦クリアし、reCAPTCHAなしの状態でもう一度、メールの送信を行い確認します。
- reCAPTCHAを停止していても、同様にエラーが出ているので、メールサーバーを疑います。
- DrupalCoreのメール送信機能とAWSのメールの問題を切り分ける為に、Drupalのフォームメールではなく、MacBookのメールクライアントから、AWSのメールアカウント宛にメールを送り、受信確認を行い、確認後、返信の確認を行います。
- このテストでは、AWSのメールには問題がありません。
この時点で考えられるのは、Drupalに登録したメールアドレスのSMTPが機能していない事が考えられます。同様のケースでXserverで動かしているDrupalには問題がないので、AWSのSMTPをDrupalCoreが動かせていない事が考えられるので、Drupalで外部のSMTPを使用出来る方法を考えます。
Drupalで外部のSMTPを使用出来るモジュールを探します。
が対応しているので、早速インストールをします。
SMTP Authentication Supportのインストール
$ sudo composer require 'drupal/smtp:^1.4'
Drupalで外部SMTPを使用するモジュールになります。設定はシンプルなので早速設定を行います。
ホーム > 管理 > 環境設定 > システム > SMTP Authentication Support
Install options
- Set SMTP as the default mailsystem // オン
SMTP server settings
- SMTPサーバー // email-smtp.ap-xxxxxx-1.amazonaws.com
- SMTP backup server // 空白
- SMTP ポート // 25や587など
- Use encrypted protocol // Use TLS
- Enable TLS encryption automatically // オン
- Timeout // 30
- ユーザー名 // SESが指定するSMTPユーザー名
- パスワード // SESが指定するSMTPのパスワード
E-mail options
- ホスト名 // 空白
- HELO // 空白
Send test e-mail
- E-mail address to send a test e-mail to // 空白
- E-mail address to reroute all emails to // 空白
構成を保存
SMTP Authentication Supportの設定を行い、Drupal側で外部SMTPが使用出来る状態になりました。AWS側でSMTPの認証を設定しDrupalからのアクセスを可能にします。AWSでSMTPの認証を設定後、SMTP Authentication Supportに設定したユーザー名とパスワードを登録することで、DrupalがAWSのSMTPを使用出来るようになります。
AWSのSES(Simple Email Service)にてSMTPの外部接続の設定を行います。
AWSのメール配信サービスであるSES(Simple Email Service)でDrupalが接続するSMTP認証の設定を行います。
SESのコンソールを開く
- Amazon マネージメントコンソールにログイン
- 検索にSESないしSimple Emailを入力しSESを検索
- 検索結果に表示されるSESを選択
- Amazon Simple Email Service の使用を開始 // 使用を開始をクリック
- Amazon Simple Email Serviceのコンソールが開きます。
Amazon SESのコンソールが表示されます。
左メニューの”SMTP設定”をクリックします。
Simple Mail Transfer Protocol (SMTP) の設定が表示されます。
- SMTP エンドポイント // email-smtp.リージョン.amazonaws.com
- Transport Layer Security (TLS) // 必須
- STARTTLS ポート // 25、587 または 2587
- カスタム SSL クライアントのサポート -
- TLS ラッパーポート // 465 または 2465
”SMTP認証情報の作成”をクリックします。
AWSのSMTPは外部からSMTPにアクセスを許可する認証情報をIAMで管理します。そのため、SMTPの認証情報はSESではなくIAMで設定し管理します。その為、クリックすると画面上、SESコンソール > IAMのコンソールに移動します。
開いたIAMのコンソールにてSMTP認証情報を作成します。
IAM / ユーザー / ユーザーの作成
Amazon SES での SMTP 認証用に SMTP 認証情報を持つ IAM ユーザーを作成します。
- ユーザーの詳細を指定 // ses-smtp-user.西暦の日付-6桁の管理番号が自動生成されています。必要なければそのままで可能
- 許可 // SESで作成したユーザーが所属するグループが表示されます。変更の必要がなければそのままで可能
- タグ // 必要であれば作成します未作成でも可
- ユーザーの作成をクリックします。
SMTP認証情報を取得に進みます。
- 表示されるIDとパスワードを控えます。(コピペ可能)
- CSVファイルのダウンロードができますので、パソコンに保存します。
以上で、AWSのSMTPにDrupalからのアクセスが可能になります。
Drupalの管理画面に戻り、SMTP Authentication Supportに取得したSMTP認証情報を登録します。
SMTP server settings
- SMTPサーバー // email-smtp.ap-xxxxxx-1.amazonaws.com
- SMTP backup server // 空白
- SMTP ポート // 25や587など
- Use encrypted protocol // Use TLS
- Enable TLS encryption automatically // オン
- Timeout // 30
- ユーザー名 // SESが指定するSMTPユーザー名
- パスワード // SESが指定するSMTPのパスワード
7.に今回発行されたID
8.に今回発行されたパスワードを入力し構成を保存するとDrupalからSESのSMTPに接続されメール送信が可能になります。
設定に不備があると、SMTP Authentication Supportの保存結果にエラーが出ますので設定に不備がないかの確認をします。エラーが表示されなければ設定は有効になっており、SESのSMTPを使用しメールが送信出来るようになっています。
DrupalでAWSのSMTPを使用し取得したドメインのメールでフォームメールから送信されるメッセージを受ける準備ができました。
外部SMTPを使用する事でメール送信のエラーが解消しているかの検証を行います。
3.検証結果で行なった動作確認を行いますが、エラーが解消されていません。。。
エラーを見ると、3.検証結果とは異なるエラーが表示されています。リダイレクトされたトップページに表示されたエラーに原因の答えが表示されます。エラーの原因は単純でした。
エラーに表示されたメッセージは、”iCloudのSMTPを確認ください”と表示されています。iCloud???となりましたが原因はすぐわかります。今回、LightsailにDrupalをインストールした際、初期設定で登録するユーザーのメールアドレスは、ドメイン取得前なので、個人で使用するiCloudのメールアドレスにしています。この仮登録したメールアドレスの変更を忘れていました。。。
早速、ユーザーのメールアドレスをiCloudの個人アドレスから今回AWSで取得したドメインのメールアドレスに変更します。変更後再度フォームメールからメッセージを送ると、問題なくメールが送信されます。
今回、記事が長くなってしまった原因の顛末は、仮登録アドレスの変更を忘れていたことが原因でした。
- 誤り ユーザー登録メール -- user@icloud.com / フォームメール -- info@my-domain.com
- 訂正 ユーザー登録メール -- info@my-domain.com / フォームメール -- info@my-domain.com
フォームメールからメール送信しようとすると、フォームメールに登録したAWSのメールアドレスと異なる、ユーザー登録したメールであるicloudのSMTPを呼びに行く為、起きてしまったエラーです。
メール送信エラーを解消するためのプロセスを延々と記事に書いていますが、原因は非常に単純なミスによるものでした。原因がわかり対処したので、取得したドメインのメールをDrupalで使用し、フォームメールの受け先として設定する目的は果たせました。以降問題なくフォームメールは使用出来ています。
今回の記事は、フォームメールのテストの内容を記事にしています。フォームメールを実際に使用する際、フィールドの追加や、説明の文書を追加しています。このあたりの内容は、今後、Drupalでページを構成する記事にて解説できればと考えています。
今回、起きたエラーで理解できた事に
- Drupalに登録するメールのSMTPは、登録メールのデフォルトのSMTPになっている。
- DrupalがSMTPやメールを配信する機能を持っているわけではない。
- 簡単にいうと、HTMLのmail:toと同じような処理をしている。
- ユーザー登録したメールアドレスのSMTPを使用して、フォームメールを送信する。
- その事で、今回、ユーザー登録したiCloudのSMTPにフォームメールで登録したAWSで取得したドメインのアドレスの送信リクエストが行く為エラーとなっていた事がエラーの原因。
当WEBサイト規模であれば、メールの送信件数もほとんどないので、外部SMTPを必要としません。取得ドメインと取得ドメインのメールアドレスを、ユーザー登録で使用し、そのメールアドレスをフォームメールで使用すれば問題ない。
という事が理解できました。
怪我の功名とも言えるのが、今回のエラーがなければ考えもしなかった、Drupalで使用するメール機能に、外部の専用化された高性能なSMTPを使用しています。その効果は、専用のSMTPを使用することでメールの送信と受信のスピードが速くなっています。
せっかく設定を行なったので、当サイトのフォームメールでの使用ではオーバースペックですが、しばらく、外部SMTPを使用した形で運用を行なって行きます。AWSはSESのメール送信の規模がそこまで大きくない場合、1年間無料のサービスをしています。
SESのメール配信機能は、本来企業などが顧客への案内メールを送信する為に、高性能化されたメール配信システムとなっています。規模の大きな多数のユーザーにメール配信を出来るようになっており、世界的な有名企業も使用するシステムとなっています。
今回の記事を要約します。
- AWSで取得したドメインのメールをDrupalのデフォルトメールとして使用
- フォームメールの受け先として使用する。
- フォームメールを使用するのでGoogle reCAPTCHAを使用する。
- モジュールはCAPTCHA、reCAPTCHA v3、reCAPTCHAを使用し、reCAPTCHA v3で認証管理し、認証にはreCAPTCHA v2を使用する。
- エラーが出てメール送信が出来ないので、外部SMTPを使用可能とする
- 外部SMTPを使用可能とするためのモジュール、SMTP Authentication Supportを使用する
- AWSを外部SMTPを使用するので、SESにてSMTPを管理し、Drupalからの認証管理の設定を行う
- 認証管理は、SESではなくて、IAMを使用し管理
- エラーの原因が、システムではなく、登録メールの間違いが原因と判明し、登録メールの間違いを修正。
- 登録メールの修正にて、エラーの原因を解消し、メール送信の問題は解決
- Drupalのメール処理のプロセスの理解
- 設定した外部SMTPはそのまま使用する。効果は、メールのレスポンスの向上
フォームメールの使用でミスからエラーを出してしまった事で、色々な検証と、当初使用を考えていなかったモジュールをインストールして使用しています。そのことで、DrupalとAWSの理解が少し進んだ事が今回の収穫であったと考えています。
Lightsail Summary.
5回に渡り、Amazon Lightsailに関連する記事を書いてきましたが、長文記事が並び、全体像がぼやけてしまったので、次項で要約します。次項の要約以降、Drupalに関連する記事を書いて行きます。