有的时候基于业务需求,我们需要把图片转化为base64格式的图片,然后就有了以下方法:
function getBase64Image(img) {
// 传入参数:图片URL 不接受跨域资源
var canvas = document.createElement("canvas");
canvas.width = img.width;
canvas.height = img.height;
var ctx = canvas.getContext("2d");
ctx.drawImage(img, 0, 0, img.width, img.height);
var ext = img.src.substring(img.src.lastIndexOf(".")+1).toLowerCase();
var dataURL = canvas.toDataURL("image/"+ext);
return dataURL;
}
原理非常简单,将图片绘制到canvas中,然后使用canvas的toDataURL
方法就可以将图片转化为base64格式的图了。