前端图片压缩基于(h5 file API & canvas)

前端压缩的意义   对于大尺寸图片的上传, 如头像等, 在前端进行压缩除了省流量外,最大的意义是提高了上传速度, 改善了用户体验。 以下例子可作为一个头像上传压缩, 图片被压缩至长宽最大小于200px。 实现原理 核心API使用canvas的drawImage()方法。 canvas的drawImage()方法API如下: context.drawImage(img, dx, dy); context.drawImage(img, dx, dy, dWidth, dHeight); context.drawImage(img, sx, sy, sWidth, sHeight, dx, …