canvas压缩图片和base64上传图片

canvas压缩图片和base64上传图片

html:

<input type="text" onchange="upload">

javaScript

function upload() {
  var file=this.files[0];
  uploadImg(file,1).then(function (data) {
    //data 就是base64返回值
  })
}

function uploadImg(file,scale) {
  return new Promise(function (resolve,reject) {
    let _scale=scale || 1;
    let cvs = document.createElement('canvas');
    let ctx = cvs.getContext('2d');
    let img = new window.Image();
    let imgType=file.type;
    img.src = URL.createObjectURL(file);
    img.onload=function () {
      cvs.width = img.width*_scale;
      cvs.height = img.height*_scale;
      ctx.drawImage(img, 0, 0, cvs.width, cvs.height);
      resolve(cvs.toDataURL(imgType));
    }
  });
}