谷歌幻灯片插入图像从侧边栏base64

Question

错误：未捕获脚本错误：异常：您尝试使用的图像无效或已损坏

在侧边栏中，图像是通过base64编码的api获得的，一旦点击图像，它就应该在幻灯片中插入/(复制/克隆(。

当传入insertImage((时，我的url为image的脚本运行良好，但使用base64作为参数时，它抛出了一个错误。

Sidebar.html(工作正常(

$.ajax({ 
.......
$('#images_assets').append($('<li>')
.attr('data-imgname', v.Id)
.html([
$('<img>')
.attr('class', 'img-mlc1')
.attr('id', 'img-mlc-' + v.Id)
.attr('src', 'data:image/png;base64,' + jqXHR.responseText)
.attr('draggable', false),
$("<span>").html(v.Id)
]));
});

//点击图片，我称这种方法为

function cloneImgInSlide(img_src) {
this.disabled = true;
$('#error').text('');
google.script.run.imgInsert(img_src);
}

Code.js(此脚本中的问题(

function imgInsert(src){
var slide = SlidesApp.getActivePresentation().getSlides()[0];
var position = {left: 0, top: 0};
var size = {width: 300, height: 100};
//seems error here after this line
var blob = Utilities.newBlob(src, 'image/png', 'MyImageName');
slide.insertImage(blob, position.left, position.top, size.width, size.height);  
}

Answer 1

我想提出以下修改。

修改要点：

首先，根据in sidebar images are coming through api in base64 encoding, once click on image it should insert/(copy/clone) in slide.，假定google.script.run.imgInsert(img_src);的img_src是base64数据。

如果google.script.run.imgInsert(img_src)的img_src是base64数据，则当var blob = Utilities.newBlob(src, 'image/png', 'MyImageName')返回base64数据的blob时。由此，可以认为这样的错误发生在slide.insertImage(blob, position.left, position.top, size.width, size.height)。

为了在脚本中使用图像blob，需要对base64数据进行解码。

当您的脚本被修改时，它变成如下。

修改的脚本：

请在谷歌应用程序脚本端修改imgInsert的功能。在该修改中，可以使用具有和不具有类似data:image/png;base64,的报头的base64数据。

发件人：

var blob = Utilities.newBlob(src, 'image/png', 'MyImageName');

收件人：

var checkHeader = src.split(",");
var bytes = Utilities.base64Decode(checkHeader.length == 1 ? src : checkHeader[1]);
var blob = Utilities.newBlob(bytes, 'image/png', 'MyImageName');

注：

• 当上述修改没有解决问题时，我认为imgInsert(src)的src可能不是base64数据。届时，请再次确认。请告诉我详细信息

参考文献：

• base64解码(编码(
• newBlob(数据，内容类型，名称(