使用ImageCapture正确旋转安卓系统上的图像

Question

我正在使用ImageCapture api从用户设备的摄像头中捕获屏幕快照。

问题是在android上拍摄的照片被错误地旋转了。它们在图片预览中、上传图像之前和上传后都被错误地旋转。

我的计划是从我从图像捕获获得的blob中读取exif数据，在exif中找到方向，并使用javascript正确地旋转图像，但是没有可用的exif数据，因为它不是jpg。

我的代码：

function takePhoto(img) { 
imageCapture.takePhoto()
.then(blob => {
  // EXIF.getData(blob, function() {
  //      myData = this;
  //      console.log( myData );
  //   });
    let url = window.URL.createObjectURL(blob);
    img.src = url;
    console.log( blob );
    // stop the camera and hide canavas
    stream.getVideoTracks()[0].stop();
    $("#webcam").hide();
    image = blob;
    $("#photo-info").slideDown('slow');
})
.catch(function (error) {
    console.log(error);
});
}; 

takePhoto(document.querySelector('#camera-feed'));

在使用ImageCapture时，是否有一种检测图像旋转不正确的方法？

Answer 1

除了其他一些问题之外，我无法完成这个任务，所以我决定把ImageCapture全部抛到一起，然后继续这样做：

<input type="file" accept="image/*" capture>

这打开了设备摄像头，只要用户点击输入按钮，这正是我所需要的，但由于与exif在android上拍摄的照片，我可以正确地旋转它。

对于旋转本身，我使用了这库

Answer 2

这取决于您正在使用的设备，您应该在采取两个步骤之后处理图片：

1. 验证照片是否旋转。
2. 如有必要，旋转照片。

要验证照片是否旋转，可以使用ExifInterface，而旋转则可以使用矩阵将其倒置，播放比特。

您可以在这个问题上找到更多相关信息和代码示例。