【作って学ぶ】GASを使ってGoogle Formsを送信時に入力された情報で自動返信メールを作成・送信する

はじめに

今回はGoogleフォームGASを使ってフォーム送信時に自動返信メールを送信する方法を紹介します。

問い合わせ用の窓口であったり、その他のフォームに応用することで、多種多様なシステムに組み込むことができます。

本記事を参考にして実際に動くものを作っていきながらGASの仕組みとメールの自動返信の方法を学んでいきましょう!

準備

本記事では以下ができていることを前提としていますのであらかじめ準備をお願いします。

  • Google Chrome がインストールされている
  • Googleアカウントを作成済みである

それでは参りましょう!

Googleフォームの作成

はじめに本システムの最重要部分であるGoogleフォームを作成していきます。

以下のリンクをクリックしてご自身のGoogleアカウントGoogle Driveにアクセスしてください。

Access Google Drive with a Google account (for personal use)…

続いてGoogle Driveの任意の場所で右クリックをして表示されるメニューの中から『新しいフォルダ』をクリック(下記画像参照)します。

フォルダの名前を入力する画面が表示されるので任意の名前のフォルダを作成してください。本記事ではお問合せフォームを作ることを想定していきますので、『お問合せフォーム』という名前にしています。

Google Driveを確認すると先ほど作成したフォルダ(下記画像参照)が新しくできていますのでダブルクリックをしてこのフォルダの中に入ります

フォルダの中に入ったら再度、任意の場所で右クリックをしてメニューの中から『Google フォーム』をクリックします。

すると新しいタブが開き下記画像のようなGoogleフォームのテンプレートが作成されます。

この時にGoogle Drive側を確認してみると『無題のフォーム』という名前のファイルが作成されているのが確認できます。

次にこの無題のフォームこと出来立てホヤホヤのGoogleフォームをお問合せフォームに合う内容にカスタマイズしていきます。

まずはフォームのタイトルを修正していきましょう。

下記画像を参考にGoogleフォーム中心のあたり(下記画像①)にある『無題のフォーム』クリックして編集してください。今回は『お問合せフォーム』という名前にしていきます。この項目を修正した後に左上の『無題のフォーム』というところ(下記画像②)をクリックすると自動で先ほど入力した名前に切り替わります。

名前をそれぞれ変えた後の見た目は下記画像のようになります。

続いてフォームの質問内容お問合せフォームに合う形に変えていきます。

事前に質問内容形式を下記に示しておきます。

  • 質問タイトル:お名前
    • 形式:記述式
    • 必須
  • 質問タイトル:メールアドレス
    • 形式:記述式
    • 必須
  • 質問タイトル:お問合せ内容
    • 形式:段落

それではこの内容の質問を作っていきます。

フォーム作成時に作られた『無題の質問』という項目を編集していきます。

はじめに下記画像を参考にして質問のタイトルを変えていきます。質問の項目左側『無題の質問』と書いてある場所(下記画像①)をクリックして『お名前』に変更してください。

続いて、質問の形式を変更します。質問の項目右側の『ラジオボタン』と書いてあるところ(下記画像②)をクリックして表示されるメニューから『記述式』(メニューの中の一番上)をクリックしてください。

最後にこの質問を必須の項目に設定します。質問の項目右下にある『必須スイッチ』(下記画像③)をクリックしてください。

この質問以降も同様にして作成をしていきます。

以上でGoogleフォームの作成が完了しました。

今回作成した質問項目以外にオリジナルの質問を追加したい場合はこちらで追加しておくことをお勧めします。

スプレッドシートの作成

続いてGoogleフォームの回答が保存されていくスプレッドシートを作成していきます。

Googleフォームのページを開いてください。

続いてページ上部中央の『回答』をクリックしてください。

切り替わったページの上部右側の『スプレッドシートのアイコン』をクリックしてください。

『回答先の選択』という項目が表示されるので上の『新しいスプレッドシートを作成』を選択してあることを確認して右下の『作成』をクリックします。

新しいタブでスプレッドシートが開きます。先ほどGoogleフォームで作成した質問がスプレッドシート1行目に書かれていることが確認できます。

Googleフォーム回答をするとこのスプレッドシートデータが蓄積されていく仕組みになっています。

ここでGoogle Driveを確認すると『お問合せフォーム』というGoogleフォームと同じ場所に『お問合せフォーム(回答)』という名前のスプレッドシートが作成されていることが確認できます。

以上でスプレッドシートの作成が完了しました。

このスプレッドシートは今後も使用していきますので管理できる場所に配置しておくようにしてください。

GASのコーディング

続いて本システムの一番難しい場所であるGAS(Google Apps Script)を書いていきます。

はじめての場合は見落としが無いように慎重に進めてください。

準備

先ほど作成したスプレッドシートを開いてください。

続いて、スプレッドシートページ上部のメニューの中から『拡張機能』をクリックして表示されるメニューの中から『Apps Script』をクリックしてください。

新しいタブでGASエディタが開きます。

まず、このGASプロジェクトプロジェクト名を修正していきましょう。

GASエディタページの左上の『無題のプロジェクト』と書いてあるところをクリックしてください。

続いて表示される項目の『プロジェクトのタイトル』『無題のプロジェクト』から別の名前に修正してください。今回は『お問合せフォーム』として進めていきます。

名前の変更が完了したら右下の『名前の変更』をクリックしてください。

プロジェクト名の変更が完了したら次はコードの動作を確認します。GASエディタでは下記画像の場所にコードを書いていきます。

ここまででGASのコーディングにおける準備は終了です。

コードの記述

続いて先ほど説明したコーディングエリアにコードを書いていきます。以下のコードコーディングエリアコピペしてください。

function onFormSubmit(e) {
  let TimeStamp = e.namedValues["タイムスタンプ"][0];
  let Name = e.namedValues["お名前"][0];
  let Email = e.namedValues["メールアドレス"][0];
  let InquiryContent = e.namedValues["お問合せ内容"][0];
  let Subject = "【自動返信】" + Name + " 様 お問合せありがとうございます";
  let Body = Name + "様 お問合せありがとうございます。" + "\n" +
             "\n" +
             "担当者より改めてご連絡いたしますのでもうしばらくお待ちください。" + "\n" +
             "\n" +
             "〜お問合せ内容〜" + "\n" +
             "お名前:" + Name + "\n" +
             "メールアドレス:" + Email + "\n" +
             "お問合せ内容:" + InquiryContent + "\n" +
             "\n" +
             "フォーム送信日時:" + TimeStamp + "\n";
  GmailApp.sendEmail(Email, Subject, Body);
}

コードコピペが完了したら、GASのエディタページ上部にあるフロッピーディスク『保存マーク』をクリックして変更したコードを保存してください。

コードの解説

ここではコードについて解説していきます。分からないことなどがあれば本記事下部にあるコメントから教えてください。

1行目について

function onFormSubmit(e)

1行目では onFormSubmit(e) という名前の関数を作成することを意味しています。

プログラミング経験者の方は関数名を自由に変えていただいても構いませんが、この後の処理でこの関数名が重要となりますので、まだプログラミングに馴染んでいない方はこのままの関数名を使用してください。

2~5行目について

let TimeStamp = e.namedValues["タイムスタンプ"][0];
let Name = e.namedValues["お名前"][0];
let Email = e.namedValues["メールアドレス"][0];
let InquiryContent = e.namedValues["お問合せ内容"][0];

2~5行目では変数と呼ばれるを作成してGoogleフォームの送信によって得られた回答を保存する処理を行なっています。

変数 TimeStampe.namedValues["タイムスタンプ"][0] でスプレッドシートの『タイムスタンプ』の値を取得します。

変数 Namee.namedValues["お名前"][0] によってスプレッドシートの『お名前』の値を取得します。

変数 Emaile.namedValues["メールアドレス"][0] によってスプレッドシートの『メールアドレス』の値を取得します。

変数 InquiryContente.namedValues["お問合せ内容"][0] によってスプレッドシートの『お問合せ内容』の値を取得します。

ここで感の良い方なら気づくかもしれませんが e.namedValues["質問の名称"][0]『質問の名称』の部分がスプレッドシートの質問の名称と一致しています。

つまり、Googleフォームで質問を増やしたり変化させた場合はこちらを修正することでGoogleフォーム送信時の回答の値をGASで得ることができます。

なお、このコード以外にもGoogleフォームからの回答データGASで得る方法がありますので、気になる方は以下の記事をご覧ください。

関連記事

データ取得の流れ 今回はGoogleフォームからデータを取得する方法を紹介しますが、データの流れとして、Googleフォームからスプレッドシートに転送してGoogle Apps Script でデータの取得を行います。 スプレッドシ[…]

6~16行目について

let Subject = "【自動返信】" + Name + " 様 お問合せありがとうございます";
let Body = Name + "様 お問合せありがとうございます。" + "\n" +
           "\n" +
           "担当者より改めてご連絡いたしますのでもうしばらくお待ちください。" + "\n" +
           "\n" +
           "〜お問合せ内容〜" + "\n" +
           "お名前:" + Name + "\n" +
           "メールアドレス:" + Email + "\n" +
           "お問合せ内容:" + InquiryContent + "\n" +
           "\n" +
           "フォーム送信日時:" + TimeStamp + "\n";

6~16行目では自動返信メール件名本文変数に代入する処理を行なっています。

6行目の let Subject = "【自動返信】" + Name + " 様 お問合せありがとうございます"; では Subject というを用意すると同時に『【自動返信】<名前> 様 お問合せありがとうございます』という文字列の中に入れる処理を行なっています。

7~17行目では先ほどと同じようにして Body というを用意すると同時に『お礼』『フォームの回答内容・回答日時』を合わせた文字列メール本文としての中に入れる処理を行なっています。

17行目について

GmailApp.sendEmail(Email, Subject, Body);

17行目では今までに作成した変数である Email 、Subject 、Body を用いてメール送信する処理を行なっています。

ここではメールの送信を行なっていますが、メール送信以外にもメールの下書きや、CCBCCなどの設定も可能です。気になる方は以下の記事をご覧ください。

関連記事

Gmailを作成して送信する場合 本文のみを送信する let Email = "test@example.com"; let Subject = "This is the subject"; let Body = "This i[…]

以上でGASコーディングについて説明は終わります。

トリガーの設定

続いてはトリガーの設定についてです。

先ほど書いたコードGoogleフォーム送信時実行するための設定を行なっていきます。GASエディタを開いてください。

ページ左側のメニューの中から目覚まし時計のアイコンの『トリガー』をクリックしてください。

続いてページの右下にある『+トリガーを追加』ボタンをクリックしてください。

表示されるメニューの中から必要な修正を行なっていきます。

『イベントの種類を選択』の項目をクリックしてメニューの中から『フォーム送信時』をクリックしてください。

修正が完了したら、『実行する関数を選択』『onFormSubmit』(独自の関数名)になっているか、『イベントの種類を選択』『フォーム送信時』になっているかを確認して、問題なければ、右下の『保存』をクリックしてください。

続いて『アカウントの選択』という画面が表示されますが、Googleフォームなどを作成したGoogleアカウントを選択し、アカウントの承認を行なってください。なお、こちらの記事にアカウント承認の詳しい方法を記載しておりますので、初めての方は確認しながら行なってください。

関連記事

承認はどこで求められる? Google Apps Script をスクリプトエディタでコーディングし、実行する際に求められます。 Google Apps Script のみで完結する処理では承認は求められませんが、スプレッドシートや[…]

アカウントの承認が完了すると、トリガーのリストに先ほど保存したものが追加されています。

以上でトリガーの設定は完了です。

動作確認

ここからはこれまでの作業で作成してきたシステムの動作確認を行なっていきます。

Googleフォームを開いてください。

Googleフォームのページ上部の『目のアイコン』をクリックしてください。

作成したGoogleフォームの入力ページが開きますので、それぞれの項目に動作確認用のデータを入力してください。

なお、メールアドレス自動返信のメールが届くメールアドレスになりますので、確認可能なメールアドレスにしてください。

Googleフォームにデータを入力して『送信』ボタンをクリックすると、入力したメールアドレスにメールが届きますのでGmailを開いて確認してください。

自動返信メール件名を確認するとコードで設定したものになっているのが確認できます。

また、本文内容Googleフォームに入力したデータが記載されていることも確認できます。

以上でGoogleフォーム自動返信メールを送信することができました。お疲れ様でした。

おわりに

今回はGASを使ってGoogle Formsを送信時に入力された情報で自動返信メールを作成・送信する方法を紹介しました。

コーディングをしはじめは難しいと感じるかもしれませんが、実際に動くものを作っていく中で一緒に学んでいきましょう!

本ブログでは今後も今回のような記事を作成していきますので、ご興味ある方はぜひフォロー・お気に入りをお願いします。

最新情報をチェックしよう!