JavaScript前端图片压缩

实现思路

• 获取input的file
• 使用fileReader() 将图片转为base64
• 使用canvas读取base64 并降低分辨率
• 把canvas数据转成blob对象
• 把blob对象转file对象
• 完成压缩

相关代码：

最后回调函数中的files可以直接当做正常的input file 使用，如果后续涉及到ajax，可以直接放到formData() 里。

本例除文中源码外，不另外提供源码。

参考地址1：https://blog.csdn.net/yasha97/article/details/83629057
参考地址2：https://blog.csdn.net/yasha97/article/details/83629510

在原文章基础上添加了blob => file的对象转化。