javascript - iOS旋转照片问题

Question

我已经使用 React (CRA) 设置了 PWA。当我在 iOS 中上传图片并使用react-image-crop它进行裁剪时，它会横向显示裁剪后的图像，它适用于所有其他设备（台式机、安卓）。我看到了一些类似的问题，但我真的不明白是什么原因造成的以及如何解决它。

任何帮助/指导将不胜感激。

Answer 1

旋转可以由图像的exif数据引起。如果它在旋转过程中丢失，iOS 将显示图像“错误”。使用在线 exif 查看器，旋转并保存图像，并检查 exif 数据是否保留。

Answer 2

我终于解决了这个问题。在获取 blob 的 URL 之前，我使用blueimp-load-image将方向设置为 1，这样它就不会根据方向值旋转图片。问题是，它被保存在我的服务器上，并且需要覆盖它。

loadImage(
  fileOrBlobOrUrl,
  function (img, data) {
    if (data.imageHead) {
      img.toBlob(function (blob) {
        loadImage.replaceHead(blob, data.imageHead, function (newBlob) {
          // do something with the new Blob object
        })
      }, 'image/jpeg')
    }
  },
  { meta: true, canvas: true, maxWidth: 800 }
)