Home > Back-end >  How to take screenshot of specific subjectline (Gmail) email using Google Apps Script?
How to take screenshot of specific subjectline (Gmail) email using Google Apps Script?

Time:11-21

I am trying to get the screenshot of the (Gmail) email which has the specific subject line using google apps script into Google Sheets. I find a source that can get screenshots of the website. Here is the sample code:

var siteUrl = "### URL you want to retrieve a screenshot. ###";
var url ="https://www.googleapis.com/pagespeedonline/v4/runPagespeed?screenshot=true&fields=screenshot&url="  
encodeURIComponent(siteUrl);
var res = UrlFetchApp.fetch(url).getContentText();
var obj = JSON.parse(res);
var blob = Utilities.newBlob(Utilities.base64DecodeWebSafe(obj.screenshot.data),
  "image/png",
  "sample.png"
);
DriveApp.createFile(blob);

We can get the threads by using the following lines for the specific subjectline:

var threads = GmailApp.search('subject:"Daily Report"')
var msgs = GmailApp.getMessagesForThreads(threads);

But due to my novice skills, I am not able to stitch them up to get the screenshot of this specific subject line email. I wonder if there is a way to get around this. Any guidance would be much appreciated. Thank you.

CodePudding user response:

I believe your goal is as follows.

  • You want to export a message of Gmail using "pagespeedapi.runpagespeed" with Google Apps Script as an image.

Issue and workaround:

In the current stage, in order to use "pagespeedapi.runpagespeed", it is required to use the public link of the site. But, unfortunately, the URL of the message in Gmail is not a public link. By this, your goal cannot be directly achieved using "pagespeedapi.runpagespeed".

When I asked you about your required values in the Email as an image, you said we can include email subject line, and email body.. From this, in this answer, as a workaround, I would like to use the following flow.

  1. Retrieve the subject and the HTML body from the Gmail message.
  2. Convert the retrieved subject and HTML body to an image using Charts.newTableChart().

When this flow is reflected in a sample script, it becomes as follows.

Sample script:

// This is from your showing script.
var threads = GmailApp.search('subject:"Daily Report"');
var msgs = GmailApp.getMessagesForThreads(threads);

// I added the blow script.
var subject = msgs[0][0].getSubject();
var htmlBody = msgs[0][0].getBody();
var imageBlob = Charts.newTableChart().setDataTable(
  Charts.newDataTable()
    .addColumn(Charts.ColumnType.STRING, '')
    .addRow([`<p style="font-size: 150%">Subject: ${subject}</p>`])
    .addRow([htmlBody])
    .build()
)
  .setOption('allowHtml', true)
  .setDimensions(1024, 1024)
  .build().getBlob();

// Here, the retrieved image is created as an image file in the root folder. By this, you can confirm the output image. The filename is "sample.png".
DriveApp.createFile(imageBlob.setName("sample.png"));

Note:

  • In this sample script, the 1st message is used from msgs of your script.

  • When this script is run, the 1st message is retrieved from msgs, and the subject and the HTML body are retrieved from the message. And then, those are converted to a PNG image as a blob. When you output the blob as an image file, you can see that the subject and the HTML body are shown in order.

  • In this sample, the font size of the subject is 150%. Please modify this for your actual situation.

  • In this sample, the image size is 1024 x 1024 as a sample size. Please modify this for your actual situation.

References:

  • Related