alex alex - 1 year ago 147
HTML Question

HTML/Javascript Acces EXIF data before file upload

I am trying to extract EXIF data from a image(jpeg) which has been dragged into the browser or has been selected via a html file input element.

I managed to preview the image within the browser using

FileReader and FileReader.readAsDataURL

as described here.

and I found a EXIF library which allows to extract the EXIF data of an image via javascript. But for me it only works if i use it with normal
tags which load their content over a URL.

I also found this question on stackoverflow where the accepted answer states that it is just not possible.

But I am pretty sure that it can be realized because extracts the EXIF data immediately after a file is added for upload and before the upload has been finished.

Some ideas how it should be possible to extract the EXIF data from the base64 encoded image I get from the FileReader?

Thanks a lot for your help!

Answer Source

I finally found a client side solution for the problem:

  1. Read the file using the FileReader and the method .readAsBinaryString
  2. Then wrap that binary string into a BinaryFile object which is already included in the EXIF Library
  3. Finally call EXIF.readFromBinaryFile(binaryFileObject);

and its done :)