html5接收后台的base64显示在canvas画布上,请使用如下的代码即可实现。
实现方法:
①页面元素
在页面中有一个DIV,ID为“显示最终图片”;
②显示的canvas是动态创建的。
功能代码如下:
$("#显示最终图片").empty();
var imgbase64 ="data:image/jpg;base64,"+data['结果'];
let img = new Image();
img.src = imgbase64;
let myCanvas = document.createElement("canvas");
let ctx = myCanvas.getContext("2d");
img.onload = () => {
myCanvas.width = img.width;
myCanvas.height = img.height;
ctx.drawImage(img, 0, 0,);
$('#显示最终图片').append(myCanvas);
$('#显示最终图片').append("<p></p>在上图中点击鼠标右键,选择'图片另存为…',即可保存图片");
};
上述代码中,接收的data['结果']就是base64码,注意,不包含头。