web-dev-qa-db-ja.com

MailAppを使用してメールにインライン画像を含める方法

HTML形式でテキストを送信する簡単なMailAppがあります。私が持っている小さな質問は、そのテキストにインライン画像を挿入するにはどうすればよいですか？たとえば、オランダ語のテキストにオランダ語のフラグを追加し、フランス語のコンテンツにフランス語のフラグを追加したいとします。

HTMLコードを使用するだけでうまくいくと思いました。しかし、残念ながら、そのような運はありません。これは私が必要とする小さな画像であり、コンテンツの下に大きな画像はありません。どうすればこれを達成できますか？

MailApp.sendEmail(mailaddress, subject, "" ,
              { htmlBody: bodyNL + bodyFR })
emailgoogle-apps-scriptgmailinline-images
8
Arie Osdorp

sendEmail(message) のドキュメントは、2つのロゴをインライン画像として電子メールに追加する方法を示しています。

これは、テキストブロックの前にロケールフラグを付けるGoogleの例からの適応です。ウィキメディアの画像を使用しており、クリエイティブコモンズの下で自由にライセンスされています。

screenshot

これがどのように機能するかの鍵は次のとおりです。

  • メール本文のHTML _<img>_タグは、添付画像を参照するために_src='cid:[name]'_を使用します。これらはContent-IDUniversal Resource Locatorであり、マルチパート電子メールメッセージの一部を参照します。
  • _<img>_タグでインラインstyleを使用して、メールクライアントにそれらの表示方法を指示できます。たとえば、添付の画像を拡大縮小しました。 （注：必要な正確なサイズのカスタム画像を使用する方が無駄が少なくなります。）

  • メールが送信用にエンコードされると、添付された各画像は独自のpartになり、で指定したcidのラベルが付けられます。 inlineImagesオブジェクト。このオブジェクトは、sendMail()メソッドの高度なパラメータオブジェクトの一部です。

    ここでは、2つのcids、nlFlagとfrFlagがあり、それぞれが ファイルBlob に関連付けられています。

    _inlineImages:
{
  nlFlag: nlFlagBlob,
  frFlag: frFlagBlob
}
_

  • ファイルblobはさまざまな方法で取得できます。ここでは、UrlFetchApp.fetch()を使用してウィキメディアからバイナリイメージを取得し、それらをblobに変換して、アタッチするblobの名前を設定しました。

コード：

_/**
 * Example of sending an HTML email message with inline images.
 * From: http://stackoverflow.com/a/37688529/1677912
 */
function sendInlineImages() {
  var mailaddress = Session.getActiveUser().getEmail();
  var subject = "test inline images";
  var bodyNL = "This is <B>DUTCH</B> text.";
  var bodyFR = "This is <B>FRENCH</B> text.";

  // Image URLs, under CC license
  var nlFlagUrl = "https://upload.wikimedia.org/wikipedia/commons/thumb/b/b2/Flag_of_the_Netherlands.png/320px-Flag_of_the_Netherlands.png";
  var frFlagUrl = "https://upload.wikimedia.org/wikipedia/en/thumb/c/c3/Flag_of_France.svg/320px-Flag_of_France.svg.png";

  // Fetch images as blobs, set names for attachments
  var nlFlagBlob = UrlFetchApp
                            .fetch(nlFlagUrl)
                            .getBlob()
                            .setName("nlFlagBlob");
  var frFlagBlob = UrlFetchApp
                            .fetch(frFlagUrl)
                            .getBlob()
                            .setName("frFlagBlob");

  // Prepend embeded image tags for email
  bodyNL = "<img src='cid:nlFlag' style='width:24px; height:16px;'/>" + bodyNL;
  bodyFR = "<img src='cid:frFlag' style='width:24px; height:16px;'/>" + bodyFR;

  // Send message with inlineImages object, matching embedded tags.
  MailApp.sendEmail(mailaddress, subject, "",
                    { htmlBody: bodyNL + "<BR/><BR/>" + bodyFR,
                      inlineImages:
                      {
                        nlFlag: nlFlagBlob,
                        frFlag: frFlagBlob
                      }
                    });

}
_
6
Mogsdad

MailAppドキュメントから：

htmlBodyString設定されている場合、HTMLをレンダリングできるデバイスは、必要なbody引数の代わりにそれを使用します。メールにインライン画像がある場合は、HTML本文にオプションのinlineImagesフィールドを追加できます

inlineImagesObject画像キー（String）から画像データ（BlobSource）へのマッピングを含むJavaScriptオブジェクト。これは、htmlBodyパラメーターが使用され、これらの画像への参照が次の形式で含まれていることを前提としています。

したがって、画像をinlineImagesの詳細パラメータに追加し、HTMLメッセージを作成するときに画像キーを参照する必要があります。

0
Reno Blair