Compnet

仕事とか遊びとか、日々折々

2016-12-31(土)

コンタクト フォームを付けました

Posted by Nakane, R. in misc   

このサイトを静的サイト ジェネレーターで構成するようにして、何気に困ったのがコンタクト フォームです。 今まで使っていた WordPress であれば代表的なプラグイン セットである JetPack に含まれている「コンタクト フォーム」を使って簡単に設置できます。 これ以外にも「WordPress コンタクトフォーム」で検索すればいくつもの素晴らしいプラグインが見つかるでしょう。

WordPress は PHP 言語で書かれているプログラムのため、コンタクト フォームに入力された問い合わせなどの情報を、誰か (Web サイトの管理者など) に送る仕組みを作ることができます。 しかし、静的サイト ジェネレーターを使った Web サイトは、HTML を生成するときにはプログラムを実行しますが、公開時は単純な HTML ファイル一式だけになるため、問い合わせなどの情報を誰かに送る仕組みが必要なコンタクト フォームは簡単には設置できません。

静的サイト ジェネレータによる Web サイトにコンタクト フォームを設置する方法を、色々と考えてみたところ、四つの方法に思い当たりました。

ひとつは Google Form などのフォームを作成できるサービスを利用する方法。 もうひとつは JavaScript で、GmailAmazon SESAmazon SNSSendGrid といったメール配信サービス (Amazon SNS はメール配信機能を含んだプッシュ通知サービス) の API を呼び出す方法です。 その他に、メール送信専用サーバーとそれを利用する JavaScript を提供している SmtpJS や、JavaScript 単体で SMTP クライアントなどを実装した email + JS = ♡ などがあるようです。

本 Web サイトでは Google Form を利用することにしました。

API によるメール配信サービスを採用しなかった理由は、API を利用するための認証情報を JavaScript 内に記述しなければならないからです。 フォームに入力された情報を Web サーバーで受け取って、Web サーバーからこれらの API を呼び出すのであれば問題ありませんが、それができないため API の呼び出しは JavaScript で行わざるを得ません。 そうなると、API を利用する際の認証情報も JavaScript に書いておくことになります。 JavaScript に書くということは、誰にでもそれが読めることであり、誰でも好き勝手にその認証情報を利用できることになってしまいます。 これはあまりにも危険な行為です。 SmtpJSemail + JS = ♡ もメール送信のための認証情報を JavaScript に書くという、同じ問題を持っています。 Google Form にはこのような問題が無さそうなのが、これを採用した理由の一つです。

Comments