js图片转base64，图片压缩

上传的文件需要转为base64作为参数提交到接口中，怎么办呢？

1.js图片转base64

toBase64(file){//转base64
    let base64=''
    const reader = new FileReader();  
    reader.readAsDataURL(file); 
    reader.onload = (e) => {  
        // 转换完成，获取Base64编码  
        this.imgBase64 = e.target.result;
        if(this.imgBase64){
            this.suofang(this.imgBase64,this.getImgList)
        }  
        // 这里可以根据需要对base64进行处理，比如存储到Vuex、Data等 
        return base64 
    }
},

使用该方法将上传的文件传入得到转化后的base64数据;

如果此时后端人员反映base64数据太大了,怎么办？压缩图片！

2.压缩图片

suofang(base64,callback) {//图片压缩函数
    //处理缩放，转格式
    var _img = new Image();
    _img.src = base64;
    _img.onload = function () {
        var quality=1;
        var _canvas = document.createElement("canvas");
        var w = this.width / 1.5;
        var h = this.height / 1.5;
        _canvas.setAttribute("width", w);
        _canvas.setAttribute("height", h);
        _canvas.getContext("2d").drawImage(this, 0, 0, w, h);
        var base64 = _canvas.toDataURL("image/jpeg",quality);
        while(base64.length>1024*1024*3){
            quality-=0.05;
            base64=_canvas.toDataURL("image/jpeg",quality);
        }
        base64=base64.substring(base64.indexOf (',')+1)
        callback(base64);//将压缩后的图片传入最终回调函数中执行
    }
},

使用该方法suofang(转化后的base64,上传方法）,一旦缩放到达具体大小(可调整：1024*1024*3）触发上传方法直接上传无需再次手动上传。