从现有草稿 [GmailApp] [Apps 脚本] 的 htmlBody 嵌入内嵌图像时会中断

Question

I am working on a mail merge script that takes a draft message with GmailApp , gets its htmlBody and attachments, and uses these to send a new message.

It works fine with attachments, and even with inline messages that have been inserted from an outside url (including images in Gmail signature); however, it can't deal with inline images directly inserted into the draft message using the Insert image panel in Gmail: these images break.

Using the includeInlineImages option of getAttachments() only changes whether the inline image in question is attached to the email or not, but regardless, it is broken in the body.

Code excerpt:

var allAttachments = draft.getMessage().getAttachments()
var htmlBody = draft.getMessage().getBody()
GmailApp.sendEmail(recipient, subject, '', {
              name:senderName,
              from:senderEmail,
              htmlBody:htmlBody,
              cc:allCc,
              bcc:bcc,
              attachments: allAttachments

Any suggestions are appreciated.

Answer 1

Broken image occurs when the source or mapping of image is not defined correctly.

If you print the htmlBody , each inline image has cid and cid is used to map the Image.

Example: <div dir="ltr"><img data-surl="cid:xxsome_idxx" src="cid:xxsome_idxx" alt="dog.jpg" width="490" height="246"><br></div>

To fix the issue, you have to set the values of inlineImages in GmailApp.sendEmail and the value of cid in your html should match the key of image in inlineImages. See example: link

I created a demo on how to set mapping of image from draft to a new email.

Example Draft:

Code:

function getInlineImagefromDraft() {
  var draft = GmailApp.getDrafts()[0];
  var allAttachments = draft.getMessage().getAttachments();
  var htmlBody = draft.getMessage().getBody();
  
  var searchstring = "img data-surl=\"cid:";
  //search string position
  var index = htmlBody.search(searchstring);
  if (index >= 0) {
    ////the goal of this section is to get the value of cid
    var pos = index + searchstring.length
    var id = htmlBody.substring(pos, pos + 15);
    //remove double quotes
    id = id.replace(/"/,"");
    //remove characters after space
    id = id.replace(/\s.*/g, "");
    
    //send email
    var recipient = 'someemail';
    var subject = 'testing only gmail';
    var senderName = 'testing name';
    var senderEmail = 'someemail';
    GmailApp.sendEmail(recipient, subject, '', {
                name:senderName,
                from:senderEmail,
                htmlBody:htmlBody,
                inlineImages: {[id]: allAttachments[0]}
  });
  }  
}

Output:

Reference:

sendEmail Advance Parameters

Answer 2

And just to add to the above solution by Nikko J., here's a code to get all inline images:

//Get all attachments for inline images
var allInlineImages = draft.getMessage().getAttachments({includeInlineImages: true,includeAttachments:false})
var justAttachments = draft.getMessage().getAttachments({includeInlineImages: false})

//Initiate the allInlineImages object
var inlineImagesObj = {}
//Regexp to search for all string positions 
var regexp = RegExp('img data-surl=\"cid:', 'g');
var indices = htmlBody.matchAll(regexp)

//Iterate through all matches
var i = 0;
for (const match of indices){
  //Get the start position of the CID
  var thisPos = match.index + 19
  //Get the CID
  var thisId = htmlBody.substring(thisPos, thisPos + 15).replace(/"/,"").replace(/\s.*/g, "")
  //Add to object
  inlineImagesObj[thisId] = allInlineImages[i]
  i++
}

GmailApp.sendEmail(recipient, subject, '', {
  name:senderName,
  from:senderEmail,
  htmlBody:htmlBody,
  cc:allCc,
  bcc:bcc,
  attachments: justAttachments,
  inlineImages: inlineImagesObj
})