AppsScript- Using an image from Google Drive in Ht

Question

The Images section of the following document

https://developers.google.com/apps-script/html_service

says that only images hosted on a public url can be displayed (due to the use of the image proxy).

Does that apply to images stored in the user's google drive? Is there any way to use such images as HtmlService elements?

Answer 1

It sounds like you're trying to offer some sort of permalink from Google Drive that is publicly accessible.

• Open the File.

• Under the File Menu, Click Sharing.

• Under "Who has access", click Change.

• Select "Public on the web".

• Click done, and copy the link listed. That is your publicly available link which should work for you.

Answer 2

There is not yet a way to do what you are asking.

Answer 3

You can embed your images using base 64 encoding.

function getFileBase64s(fileName) {
  var output = [];
  if (typeof fileName === 'string'){
    var fileIterator = DriveApp.getFilesByName(fileName);
    while (fileIterator.hasNext()) output.push(Utilities.base64Encode(fileIterator.next().getBlob().getBytes()));
  } else {
    SpreadsheetApp.getUi().alert('File name: '+fileName+' is not an string')
  };
  return output;
};

In your HTML template:

<? getFileBase64s('fileName').forEach(function(fileBase64){ ?>
    <img src="data:image/png;base64,<?=fileBase64?>" >
<? }) ?>