图片文件获取base64地址

106 阅读1分钟

参数1:file文件,参数2:回调方法拿到base64地址

export function getImgBase64(file, callback) {
    var url ="";
    //创建文件阅读器
    var reader = new FileReader();
    //创建图片
    var img = new Image();
    //读取为数据url
    reader.readAsDataURL(file);
    ∥/文件阅读器加载事件
    reader.onload = (e) =>{
        img.src = e.target.result;
        ∥/图片加载事件
        img.onload =()=>{
            var canvas = document.createElement("canvas");
            var context = canvas.getContext("2d");
            canvas.width = 200;
            canvas.height = 100;
            //核心Js就这个图片绘制成canvas
            context.drawImage(img, 0, 0, canvas.width, canvas.height);
            //canvas绘制的图片转换成base64格式信息
            url = canvas.toDataURL();
            callback(url)
        };
    };
}

引入使用,调用如下

getImgBase64(file.file,(url)=>{// console.log(url);在回调里做的操作//});