15

我正在尝试从已拖入浏览器或已通过 html 文件输入元素选择的图像(jpeg)中提取EXIF数据。

我设法使用此处FileReader and FileReader.readAsDataURL 描述的方法在浏览器中预览图像。

我找到了一个EXIF 库,它允许通过 javascript 提取图像的 EXIF 数据。但对我来说,它只有在我将它与img通过 URL 加载其内容的普通标签一起使用时才有效。

我还在 StackOverflow 上发现了这个问题,其中接受的答案表明这是不可能的。

但我很确定它可以实现,因为500px.com在添加要上传的文件之后和上传完成之前立即提取 EXIF 数据。

一些想法应该如何从我从 FileReader 获得的 base64 编码图像中提取 EXIF 数据?

4

3 回答 3

16

我终于找到了该问题的客户端解决方案:

  1. FileReader使用and 方法读取文件.readAsBinaryString
  2. 然后将该二进制字符串包装到已包含在EXIF 库中的 BinaryFile 对象中
  3. 最后打电话EXIF.readFromBinaryFile(binaryFileObject);

它完成了:)

于 2012-04-27T07:12:04.723 回答
4

jQuery-fileExif javascript 库在上传之前读取图像 exif 数据。
GitHub 链接,库中的示例jsfiddle

var someCallback = function(exifObject) {

    $('#cameraModel').val(exifObject.Model);
    $('#lat').val(exifObject.GPSLatitude);
    $('#lng').val(exifObject.GPSLongitude);
    // Uncomment the line below to examine the
    // EXIF object in console to read other values
    //console.log(exifObject);

  }

      try {
        $('#file').change(function() {
            $(this).fileExif(someCallback);
        });
      }
      catch (e) {
        alert(e);
      }
于 2012-12-29T12:10:24.813 回答
3

查看FxIF firefox 扩展的代码。它仅使用 JavaScript 读取 exif 数据。要读取文件内容,您可以使用现代浏览器的FileReader API

于 2012-04-26T21:58:30.737 回答