exif.js 旋转图片

还是那个问题：网上的大胸弟们BB一大堆，没几个给的代码能用的，话不多说，直接上demo：

链接：https://pan.baidu.com/s/1jJ6vnt8 密码：swwm

不要忽视demo中的setTimeout，每个人的机子和浏览器的反应速度不同，而exif.js貌似又是异步型的，如果不用setTimeout，会导致在某些浏览器（PC或手机）不能旋转。我在demo设置的时间为1毫秒，这时间是最短的了，不设置的话，本屌的谷歌浏览器有50%的几率不旋转图片。我试过同事的iphone6S，要设置到500毫秒才能保证百分百旋转。（如果各位觉得这样用户体验不好，可先设置图片透明度为0，旋转完成后再变成1，即可解决转图片的坑爹视觉效果）。

 

下面介绍何为exif，

　　EXIF（Exchangeable Image File）是“可交换图像文件”的缩写，当中包含了专门为数码相机的照片而定制的元数据，可以记录数码照片的拍摄参数、缩略图及其他属性信息，简单来说，Exif信息是镶嵌在 JPEG/TIFF 图像文件格式内的一组拍摄参数，需要注意的是EXIF信息是不支持png,webp等图片格式的。 
对于七牛，可以在图片后面加?exif参数来获取图片的exif信息。

　　对于Orientation参数，简单的说是记录图片拍摄的相机的旋转信息，浏览器(需要浏览器支持)可以根据这个参数中的val信息自动旋转图片到正确的方向。

　　简单来说：iphone和数码相机拍出来的照片带exif，用照片查看器，或在iphone上看图片是正的，在浏览器中用img标签加载的时候却是旋转过的。