将 Google 文档中的 InlineImage 转换为 HTML 图像
Convert InlineImage in Google Docs to an HTML image
我正在开发 Google Docs 插件,我需要从 Google Docs 文档中获取 InlineImage 并将其转换为 HTML 图像。
我最初的策略是从 InlineImage 获取数据并将其转换为 data URI,但我了解到应用程序脚本不支持此操作。有人知道我该怎么做吗?
你说得对,Caja template system doesn't support data URIs, but you can work around this by switching your sidebar to use the IFRAME
sandbox mode。由于 IFRAME
模式不使用 Caja,因此不受相同的限制,但有一个警告:它与旧浏览器不兼容。但是,如果您需要使用数据 URI,您就别无选择。
这是一个示例脚本,它会使用数据 URI 获取选定的图像并将其显示在加载项侧边栏中。
Code.gs:
function getImage() {
var els = DocumentApp.getActiveDocument().getSelection().getRangeElements();
var el;
for (var i = 0; i < els.length; i++) {
el = els[i].getElement();
if (el.getType() === DocumentApp.ElementType.INLINE_IMAGE) {
return el;
}
}
return null;
}
function showSidebar() {
var mimetype = 'image/png';
var blob = getImage().getAs(mimetype);
var uri = 'data:' + mimetype + ';base64,' + Utilities.base64Encode(blob.getBytes());
var sidebar = HtmlService.createTemplateFromFile('Sidebar');
sidebar.data = uri;
DocumentApp.getUi().showSidebar(
sidebar
.evaluate()
.setSandboxMode(HtmlService.SandboxMode.IFRAME)
);
}
Sidebar.html:
<img src="<?!= data ?>" />
我正在开发 Google Docs 插件,我需要从 Google Docs 文档中获取 InlineImage 并将其转换为 HTML 图像。
我最初的策略是从 InlineImage 获取数据并将其转换为 data URI,但我了解到应用程序脚本不支持此操作。有人知道我该怎么做吗?
你说得对,Caja template system doesn't support data URIs, but you can work around this by switching your sidebar to use the IFRAME
sandbox mode。由于 IFRAME
模式不使用 Caja,因此不受相同的限制,但有一个警告:它与旧浏览器不兼容。但是,如果您需要使用数据 URI,您就别无选择。
这是一个示例脚本,它会使用数据 URI 获取选定的图像并将其显示在加载项侧边栏中。
Code.gs:
function getImage() {
var els = DocumentApp.getActiveDocument().getSelection().getRangeElements();
var el;
for (var i = 0; i < els.length; i++) {
el = els[i].getElement();
if (el.getType() === DocumentApp.ElementType.INLINE_IMAGE) {
return el;
}
}
return null;
}
function showSidebar() {
var mimetype = 'image/png';
var blob = getImage().getAs(mimetype);
var uri = 'data:' + mimetype + ';base64,' + Utilities.base64Encode(blob.getBytes());
var sidebar = HtmlService.createTemplateFromFile('Sidebar');
sidebar.data = uri;
DocumentApp.getUi().showSidebar(
sidebar
.evaluate()
.setSandboxMode(HtmlService.SandboxMode.IFRAME)
);
}
Sidebar.html:
<img src="<?!= data ?>" />