Utilizzo di immagini con codifica Base64 con HtmlService in Script di app

Question

Google Apps Script supporta l'uso di immagini con codifica Base64 con il servizio HTML? Sto cercando di aggiungere immagini a una pagina HTML utilizzando la codifica base64, ma non vengono visualizzate nella pagina finale.

Il codice HTML che sto cercando di utilizzare è:

<img src="data:'+contentType+';base64,'+encoded+'"/> 

Quando annoto il contenuto HTML appena prima che esso è stato reso dal servizio HTML questo appare come:

<img src="data:image/png;base64,iVBORw0KGgoAAAANSUh.....(base64 string)/> 

Questo funziona bene in JSFiddle e nel normale HTML, ma in Apps Script, le immagini non vengono visualizzate. Quando si visualizza il codice sorgente della pagina resa, i tag di immagine appaiono come segue:

<img src="null"> 

C'è un altro modo per aggiungere immagini codifica base64 pagina? Posso ottenere le immagini come un blob, ma non penso che ci sia un modo per aggiungere direttamente un blob al contenuto HTML.

Answer 1

A partire da December 2014, Google Apps Script ha aggiunto un ulteriore IFRAME sandbox mode, che supporta gli URI di dati (poiché non utilizza il compilatore Caja). Lo svantaggio è che la modalità IFRAME non è compatibile con i browser più vecchi, ma a seconda dei requisiti che potrebbero non essere un problema.

Tutto quello che serve è di chiamare setSandboxMode() sul modello, e il vostro URI dati dovrebbe funzionare come previsto:

var output = HtmlService.createHtmlOutput(
    '<img src="data:' + contentType + ';base64,' + encoded + '"/>' 
); 

output.setSandboxMode(HtmlService.SandboxMode.IFRAME); 

Answer 2

Questo è Issue 1558 per il compilatore Google Caja - visitare e contrassegnarlo per "votare" e ricevere aggiornamenti. Hai provato a provare nel Caja Testbed?

Un'alternativa può essere quella di avere una funzione lato server recuperare i Base64 immagine codificati tramite UrlFetch, decodificarlo utilizzando base64Decode, quindi salvare il blob come un file immagine e host it from Google Drive. Mi aspetto che questo sarebbe molto lento, sfortunatamente.

Answer 3

per ottenere la stringa base64 codificata in primo luogo dai file di Google Drive:

GS

var response = UrlFetchApp.fetch('https://googledrive.com/host/fileId/name.png'); 
var blob = response.getBlob(); 
var bytes = blob.getBytes(); 
var base64String = Utilities.base64Encode(bytes); 
Logger.log(base64String); 
// now copy and paste into html 

HTM L

<img src="data:image/png;base64, <base64String>" alt="img name" />