H5图片压缩上传图片基本思路及注意事项

H5图片压缩上传图片基本思路：
1、使用FileReader 读取本地上传的文件，然后使用 new Image生成图片；
2、使用canvas绘制图片，并压缩图片

let canvas = document.createElement('canvas'),
                ctx = canvas.getContext('2d'),
ctx.drawImage(img, 0, 0, width, height);

// 压缩图片，第一个参数为图片格式，第二个参数为质量系数（0-1）；
图片格式为 image/jpeg 或 image/webp的情况下，质量系数生效
 canvas.toDataURL(' image/jpeg ', 0.6);

3、将canvas压缩后的base64转为blob对象；
4、使用formData传文件对象给后台；

注意事项：
使用new File将base64转文件给后台有兼容性问题，会导致传给后台的文件数据为空。