H5调用相机拍照并压缩图片的方法(解决IOS拍照保存旋转90度问题)

最近在做H5调用相机拍照上传,发现IOS高版本型号拍照上传图像旋转了90,这里需要对苹果手机拍照的图像获取角度进行旋转后保存。

H5调用相机/相册

调用相机最简单的方法就是使用input file[camera]属性:

<input type="file" capture=camera accept="image/*">//相机
<input type="file" accept="image/*">//相册

图片压缩分为图片大小压缩和质量压缩

图片大小压缩也就是分辨率压缩这里设置了图片的最大边为480,另一边按照图片原有比例缩放,也可以设置图片整体的缩放比例。

var MAX_WH=480;
var image=new Image();
image.onload=function () {
  if(image.height > MAX_WH) {
    // 宽度等比例缩放 *= 
    image.width *= MAX_WH/ image.height;
    image.height = MAX_WH;
  }
  if(image.width > MAX_WH) {
    // 宽度等比例缩放 *= 
    image.height *= MAX_WH/ image.width;
    image.width = MAX_WH;
  }
}
image.src=dataURL;//dataURL通过FileReader获取

图片质量压缩,这里设置压缩了80%,如果设置太小图片就会失真,不清楚了。

var quality=80;
var cvs = do

版权声明:本文为cry_smile_hate原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。