js 将图片转换为base64编码

将图片转换为Base64

function image2Base64(img) {
    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 dataURL = canvas.toDataURL("image/png");
    return dataURL;
}

获取图片Base64编码

function getImgBase64(){
    var base64="";
    var img = new Image();
    img.src="img/test.jpg";
    img.onload=function(){
        base64 = image2Base64(img);
        alert(base64);
    }
}

getImgBase64();

方式一：Blob和FileReader 对象
实现原理：
使用xhr请求图片,并设置返回的文件类型为Blob对象[xhr.responseType = "blob"]
使用FileReader 对象接收blob

方式二：canvas.toDataURL()方法
实现原理：
使用canvas.toDataURL()方法
需要解决图片跨域问题 image.crossOrigin = '';
使用了Jquery库的$.Deferred()方法