在javascript中基于exif方向旋转图像

// 读取图像文件
var fileInput = document.getElementById('fileInput');
var file = fileInput.files[0];
var reader = new FileReader();

reader.onload = function(e) {
  var img = new Image();
  img.onload = function() {
    // 解析exif信息
    var exifData = EXIF.getData(img);
    var orientation = exifData.Orientation;

    // 创建canvas元素
    var canvas = document.createElement('canvas');
    var ctx = canvas.getContext('2d');

    // 根据旋转方向旋转图像
    switch (orientation) {
      case 3:
        canvas.width = img.height;
        canvas.height = img.width;
        ctx.rotate(Math.PI);
        ctx.drawImage(img, -img.width, -img.height);
        break;
      case 6:
        canvas.width = img.height;
        canvas.height = img.width;
        ctx.rotate(Math.PI / 2);
        ctx.drawImage(img, 0, -img.height);
        break;
      case 8:
        canvas.width = img.height;
        canvas.height = img.width;
        ctx.rotate(-Math.PI / 2);
        ctx.drawImage(img, -img.width, 0);
        break;
      default:
        canvas.width = img.width;
        canvas.height = img.height;
        ctx.drawImage(img, 0, 0);
    }

    // 将旋转后的图像显示在页面上
    var resultContainer = document.getElementById('resultContainer');
    resultContainer.appendChild(canvas);
  };

  img.src = e.target.result;
};

reader.readAsDataURL(file);