前端cavans压缩图片的实现

前端cavans压缩图片的实现

 

先看demo：使用canvas在前端压缩图片并上传demo

canvas.toDataURL(mimeType, qualityArgument)

对于本案例的压缩，使用的5个参数的API方法：

context.drawImage(img, dx, dy, dWidth, dHeight);复制代码

各参数具体含义可以参见“Canvas API中文文档-drawImage”，这里不展开。

举例：
一张图片（假设图片对象是img）的原始尺寸是4000*3000，现在需要把尺寸限制为400*300大小，很简单，原理如下代码示意：

v