みなさん、こんにちは！
タカハシ(@ntakahashi0505)です。

Google App ScriptではGmailを操作してメールを送信することができます。

以下記事でお伝えしている通りです。

初心者でも簡単！Google Apps ScriptでGmailを操作してメールを送る方法

Google Apps Scriptでメールマガジンを送るシステムを作りたいと思います。シリーズ初回の今回は、Google Apps ScriptでGmailを操作してメールを送る方法です。

tonari-it.com

さてさて、そのGmailの内容として、シンプルなテキストメールだけでなく、HTMLメールも送れるのはご存じだったでしょうか？

HTMLメールが実現できるのであれば多彩なビジュアルのメールマガジンを作成することもできますし、アクションのためのリンクボタンを仕込むこともできますね。

ということで、今回はGoogle Apps ScriptでGmailからHTMLメールを送る方法についてお伝えします。

では、行ってみましょう！

sendEmailでHTMLメールを送信する

HTMLメールを送信する場合も、GmailAppサービスのsendEmailメソッドを使います。

書き方を復習しておきますと

となります。

このオプションの部分に連想配列の形式で、様々なオプションを設定できます。

オプション名	機能
attachments	添付ファイル
bcc	bccアドレス
cc	ccアドレス
from	fromアドレス
name	送信者名

などが挙げられますが、htmlメール用のオプションとしてhtmlBodyを設定することができます。

ですから、例えばhtmlという変数にHTML文を準備できれば

  GmailApp.sendEmail(
    'takahashi@hoge.jp', //宛先
    '備品購入申請のお知らせ', //件名
    'htmlメールが表示できませんでした', //本文
    {
      from: 'system@hoge.jp', //送り元
      htmlBody: html
    }
  );

とすれば良いわけです。

ちなみに、htmlBodyを設定しておくと、HTMLメールが閲覧できる環境ではそれが表示され、そうでない場合はbodyが表示されるようになります。

プロジェクト内のhtmlファイルからHTML文を取得する

HTML文ですが、ベタ打ちで変数に格納しても良いのですが、せっかくですからプロジェクト内のhtmlファイルを使いましょう。

プロジェクト内のhtmlファイルは、HtmlServiceのcreateHtmlOutputFromFileメソッドとgetContenメソッドで読み込むことができます。

例えば「message.html」というファイル名でメッセージ用のHTML文を用意しているのであれば

var html = HtmlService.createHtmlOutputFromFile("message").getContent();

とすることで、変数htmlに格納することができます。

詳細は以下の記事をご覧下さい。

Google Apps ScriptのWebアプリケーションにCSSでスタイル設定をする

Google Apps ScriptでWebアプリケーションを作る方法についてお伝えしています。今回GASのWebアプリケーションにCSSでスタイル設定をする方法です。CSSを別ファイルにする方法もありますよ。

tonari-it.com

GASでHTMLメールを送るスクリプト

では、試しにHTMLメールを作成して送信してみましょう。

まず、HTML文はmessege.htmlに以下を用意しました。

  
    
  
  
    
備品購入申請のお知らせ
    
申請内容
      

        
申請者：高橋
        
内容：消しゴム500個
        
税込価格：54,000
      

    
承認しますか？
      
OK
      
NG
  

備品購入申請の承認を促すメールを想定しています。今、URLはサンプルとして本ブログにしていますが、次回以降のシリーズでワークフローが実現できるようなURLに変更していきます。

そして、gsファイルには以下のsendHtmlMailを作成します。

function sendHtmlMail() {

  /* message.htmlを取得 */
  var html = HtmlService.createHtmlOutputFromFile("message").getContent();

  /* メールを送信 */
  GmailApp.sendEmail(
    'takahashi@hoge.jp', //宛先
    '備品購入申請のお知らせ', //件名
    'htmlメールが表示できませんでした', //本文
    {
      from: 'system@hoge.jp', //送り元
      htmlBody: html
    }
  );
}

HTMLを実行した結果

sendHtmlMailを実行すると、以下のようなメールが送信先に送られます。

見出し、リスト、ボタンなどそのスタイルとともにちゃんと表示されていますね。

ボタンは押下するとちゃんと当ブログのトップページに飛びますです。

まとめ

Google Apps ScriptでHTMLメールを送る方法についてお伝えしました。

htmlファイルさえ準備できれば簡単ですね！

さて今後ですが、今回作ったHTMLメールをベースとして、備品購入申請のワークフローを作りあげていきたいと思います。

次回は、GASにURLでアクセスした際に処理をする方法、またURLのパラメータの内容によって処理を分岐する方法をお伝えしていきます。

GASでURLを踏んでスクリプトを動作させたときにパラメータを渡す方法

Google Apps Scriptで備品購入申請を題材にワークフローを作る方法をお伝えしています。今回は、GASでURLを踏んでスクリプトを動作させたときにパラメータを渡す方法をお伝えします。

tonari-it.com

どうぞお楽しみに！

連載目次：初心者でも作れるGASによる簡単ワークフロー

スプレッドシート、Gmail、フォーム…Google Apps Scriptで操作できるアプリケーションはまさに「ワークフロー」を作成する上で必要なものが揃っています。ということで、このシリーズでは初心者でも簡単に作れるワークフローの作り方について解説をしていきます。

1. 備品購入申請フォームをGoogleフォームで作成する方法
2. Google Apps Scriptでフォーム送信時にメッセージを送るスクリプトの作り方
3. Google Apps Scriptでフォーム送信した内容を含んだメッセージをGmailで送るスクリプト
4. Google Apps Scriptで特定のURLを踏んだらスクリプトを動作させるdoGet関数の使い方
5. GASでURLを踏んでスクリプトを動作させたときにパラメータを渡す方法
6. 【GASで作るワークフロー】URLクリックで「承認」とするスクリプトの作り方
7. GASで送信するGmailのメッセージをプレーンでもHTMLでも送れるようにする
8. GASのワークフローでURLのパラメータで承認・否認を切り替える方法