在客户端从 Base64 图像字符串中提取 exif（使用 javascript 或 jquery）

Question

我有一个网站，允许通过

<input type="file">

onChange，我的 javascript 获取上传的图像，将其转换为 base64，并将其显示为 html 的背景。

凉爽的。

问题：当我将移动设备上拍摄的照片放在 html 元素上时，它们会显示为横向或颠倒（“旋转”）。

我一直在做研究，发现解决这个问题的方法是从图像文件中读取 EXIF 值，该值包含图像在屏幕上显示时应定向的答案。

在过去的三天里，我一直在尝试提取我的 base64 图像的 exif 值，但还没有取得多大进展。

我尝试使用库 exif.js，但返回时出现大量无法识别的字符：

<script>            
    var isaacImg = "data:image/gif;base64,R0lGODlh...hB0SlBCBMQiB0UjIQA7"
    var x = decode64(isaacImg);
    console.log(x);
</script>

我还尝试了此 stackOverflow 答案中的以下代码，但我的浏览器无法识别对象 EXIF：

<script>
    var b64 = "data:image/jpeg;base64,/9j/4AAQSkZJRgABA......";
    var bin = atob(b64.split(',')[1]);
    var exif = EXIF.readFromBinaryFile(new BinaryFile(bin));
    alert(exif.Orientation); 
</script>

Answer 1

我发现以下用于 Base64 转换的库适合我的要求。 http://jsbase64.codeplex.com/。您可能也想尝试一下。