关于手机端h5上传图片配合exif.min.js，processImg.js的使用

时间：2024-03-11 20:02:51

首先这里有个new FileReader()的概念,这是h5新增的，用来把文件读入内存，并且读取文件中的数据。FileReader接口提供了一个异步API，使用该API可以在浏览器主线程中异步访问文件系统，读取文件中的数据，他有个readAsDataURL的方法,可以读取url，同时input file的change事件里面有个this.file是个数组，反应的当前上传文件的具体参数

打印出来有这些，可以判断当前上传文件类型和大小,通过readAsDataURL(this.files[0]),就可以读取当前文件,然后再Filerender的实例的onload方法里面获取当前结果

地址这就是原理,那么exif有什么用呢？ 因为ios在拍照上传照片时候，会旋转90度自动修正，而exif就是保存图片元数据的作用

代码如下

EXIF.getData(p, function() {
 orientation = parseInt(EXIF.getTag(p, "Orientation"));
 orientation = orientation ? orientation : 1;
});