heic图片的前端处理方式
今天遇到了一个伙伴上传了一张heic的图片,但是不论是在手机端还是浏览器,heic图片格式支持都不够好,只能进行格式转换操作。
一、后端处理:
连接:https://github.com/nokiatech/heif
建议图片在上传时进行格式转换,前端转换对设备性能有一定要求,且表现不一致。
二、前端处理 heic2any
安卓端效率还是挺快的,但是在ios端进行转码的话,一个1.5m左右的图片,花费了2分多种的时间,甚至更长。
首先是安装
1
|
npm install heic2any |
具体代码如下:
import heic2any from 'heic2any' heic2any({ blob, // 将heic转换成一个buffer数组的图片 toType: 'image/jpg', //要转化成具体的图片格式,可以是png/gif quality: 0.1 // 图片的质量,参数在0-1之间 }).then(result => { let file = new FileReader(); file.onload = function(imageFile) { let imgBase64 = imgFile.target.result; }; file.readAsDataURL(result); })
更错参数详见代码及文档
https://github.com/alexcorvi/heic2any/blob/master/src/heic2any.ts
https://github.com/alexcorvi/heic2any/blob/master/docs/getting-started.md
用心写代码,不辜负程序员之名。