1 前言
解决图片拍摄上传原图过大导致上传时间过长然后超时报错的问题。
- 优点：压缩图片减少上传时间
- 缺点：图片会变糊，对于图片质量要求不高可以使用
2 安装
安装第三方插件 image-conversion：
npm install --save image-conversion
3 使用
在文件中引入插件：
import * as imageConversion from 'image-conversion'
封装一个方法，输入上传的图片file和需要限制的大小limit，单位是KB，输出一个压缩后的图片Blob
compressImg (file, limit) {
return new Promise((resolve) => {
if (file.size > limit) {
imageConversion.compressAccurately(file, limit).then(res => {
resolve(res)
})
} else {
resolve(file)
}
})
}
在文件上传的时候使用，只压缩超过100k的图片：
const size = file.size / 1024
console.log(`压缩前${size}k`)
this.compressImg(file, 100).then(comRes => {
console.log(`压缩后${comRes.size / 1024}k`)
})
随便传两张图片：
小于100k图片
大于100k图片
压缩完图片以后便可以执行上传了
