H5 input拍照上传图片，处理图片旋转压缩并转成file文件

之前图片上传都是上传的base64码，但是这次需要存到其他系统服务器，只接收file，所以整理了一个公共方法，主要用于移动端，PC端没有试过，包含图片的旋转，压缩和转成file文件。
初始代码是循环压缩到100kb以下的，但是压缩超过3次以后，后台接到的file开始报错，偶发性，自己测试没有复现，上了生产就有问题，所以综合考虑改为100kb以下，只旋转，大于100kb只压缩一次了，不需要循环压缩的可以参考一下。
问题还在查找，要是哪位大佬能定位并解决这一问题，将不胜感激！

上代码

html

<script src="js/faceRecognitionCommon.js" type="text/javascript" charset="utf-8"></script>
<input type="file" capture="user" class="form-control" id="facethumbnail" name="thumbnail" accept="image/*">

js部分

$('#facethumbnail').change(function(e) {
        if(!e.target.files[0]){
            return;
        }
        var size = e.target.files[0].size;
        console.log(size);
        if(size > 10240*1024){
            $scope.vo.faceidMessage = "图片大小不能超过10MB，请重新上传";
            $(".alertmessage").fadeIn(0);
            return;
        }
        faceRecognitionCommon(e,facecheck);
    });

faceRecognitionCommon.js部分

var num = 1;
function faceRecognitionCommon(file,getImageFile){//file标识input上传的event，getImageFile是拿到file文件后回调
  cutImageBase64Common(file,getImageFile);
};
//压缩
function cutImageBase64Common (e,getImageFile) {
    var file = e;
    num++;
    var URL = window.URL || window.webkitURL;
    var blob = URL.createObjectURL(file);
    var img = new Image();
    img.src = blob;
    img.onload = function() {
      if(size >= 100){
          compressCommon(img, file.type,e,getImageFile,2);//2表示压缩比例
      }else {
          compressCommon(img, file.type,e,getImageFile,1);//1表示压缩比例
      }
    }
};
//上传
function getFilesizeaCommon(e,getImageFile){
    var fileName = new Date().getTime() + ".jpg";
    var file = new File([e],fileName,{ type: "image/jpg" });
    var size = file.size/1024;
    console.log("图片大小"+size+"kb");
    getImageFile(file);
};
//压缩
function changeImageToFileCommon(base64,getImageFile){
    var blob = dataURLtoBlobCommon(base64);
    var file1 = blobToFileCommon(blob, "1.jpg");
    var fileName = new Date().getTime() + ".jpg";
    var file = new File([file1],fileName,{ type: "image/jpg" });
    var size = file.size/1024;
    // if(size >= 100){
    //   cutImageBase64Common(file,getImageFile);
    //   return;
    // }
    console.log(file);
    getFilesizeaCommon(file,getImageFile);
};

//旋转位置
function compressCommon(img, fileType,e,getImageFile,num) {
    var canvas = document.createElement("canvas");
    var rotateshow;
    console.log(img);
    EXIF.getData(img, function(){
      EXIF.getAllTags(img);
      window["Orientation"] = EXIF.getTag(img,'Orientation');
      console.log(Orientation);
      switch (Orientation){
        case 6:
          rotateshow = rotateImgCommon(img,'left',canvas,fileType,getImageFile,num);
          break;
        case 8:
          rotateshow = rotateImgCommon(img,'right',canvas,fileType,getImageFile,num);
          break;
        case 3:
          rotateImgCommon(img,'right',canvas,fileType,getImageFile,num);
          rotateshow = rotateImgCommon(img,'right',canvas,fileType,getImageFile,num);
          break;
        case undefined:
          rotateshow = rotateImgCommon(img,'center',canvas,fileType,getImageFile,num);
          break;
        case 1:
          rotateshow = rotateImgCommon(img,'center',canvas,fileType,getImageFile,num);
          break;
        default:
          rotateshow = rotateImgCommon(img,'center',canvas,fileType,getImageFile,num);
      }
    });
};
function rotateImgCommon(img, direction,canvas,fileType,getImageFile,num) {
    var min_step = 0;
    var max_step = 3
    if (img == null)return;
    //img的高度和宽度不能在img元素隐藏后获取，否则会出错
    var height = img.height/num;
    var width = img.width/num;
    var step = 2;
    if (step == null) {
      step = min_step;
    }
    if (direction == 'right') {
      step++;
      //旋转到原位置，即超过最大值
      step > max_step && (step = min_step);
    } else if (direction == 'left') {
      step--;
      step < min_step && (step = max_step);
    } else {
      step = min_step;
    }
    var degree = step * 90 * Math.PI / 180;
    var ctx = canvas.getContext('2d');
    console.log(step);
    switch (step) {
      case 0:
        canvas.width = width;
        canvas.height = height;
        ctx.drawImage(img, 0, 0, canvas.width, canvas.height);
        break;
      case 1:
        canvas.width = height;
        canvas.height = width;
        ctx.rotate(degree);
        ctx.drawImage(img, 0, -height, canvas.height, canvas.width);
        break;
      case 2:
        canvas.width = width;
        canvas.height = height;
        ctx.rotate(degree);
        ctx.drawImage(img, -width, -height, canvas.width, canvas.height);
        break;
      case 3:
        canvas.width = height;
        canvas.height = width;
        ctx.rotate(degree);
        ctx.drawImage(img, -width, 0, canvas.height, canvas.width);
        break;
    }
    var base64 = canvas.toDataURL(fileType);//也可以canvas.toDataURL(fileType,"压缩质量0-1");
    changeImageToFileCommon(base64,getImageFile);
};
//base64码转换成file文件
function dataURLtoBlobCommon(dataurl) {
    var arr = dataurl.split(','),
      mime = arr[0].match(/:(.*?);/)[1],
      bstr = atob(arr[1]),
      n = bstr.length,
      u8arr = new Uint8Array(n);
    while (n--) {
      u8arr[n] = bstr.charCodeAt(n);
    }
    return new Blob([u8arr], { type: mime });
};
//将blob转换为file
function blobToFileCommon(theBlob, fileName){
    theBlob.lastModifiedDate = new Date();
    theBlob.name = fileName;
    return theBlob;
};

补充：

new File(）----ios低版本不兼容，也可以直接传blob，blob和file的区别可自行查询，不再赘述。