lrz 图片处理工具

187 阅读1分钟

lrz 图片压缩后上传,保持图片清晰度

背景:ocr识别对图片清晰度有要求,因此需要压缩后上传,以便于识别除正确结果

<el-upload action="#" :auto-upload="false" @change="handleChangeImg($event)" :show-file-list="false">
    <img :src="imgSrc" alt="" class="img">
</el-upload>
<script>
// npm install lrz
import lrz from 'lrz'
const handleChangeImg = (val)=>{ // 选择文件
        lrz(val.raw, { width: 2000, quality: 0.85 }).then((result: any) => {
            // result 压缩结果
            console.log(result.base64) // base64文件
            console.log(result.base64Len) // base64文件大小
            console.log(result.file) // 压缩后的文件
            console.log(result.fileLen) // 文件大小
            console.log(result.formData) // 后端可处理的表单数据
            console.log(result.origin) // 原始文件
            // 图片反显
            imgSrc.value = result.base64
            // 文件上传
            const file = new File([result.file], val.raw.name, {
                type: val.raw.type,
                lastModified: val.raw.lastModified,
            })
            const formdata = new FormData()
            formdata.append('file', file)
            formdata.append('type', type)
            const res = await http.post('/file/upload/xx', formdata)
        })
}
</script>