Is it possible to parse an image object (<img>
) in the DOM as if it had been uploaded and opened with FileReader? I am trying to use jpegmeta.js to extract EXIF metadata from JPEGs, but it needs binary strings which are returned by the FileReader.
It might be possible to use XHR to load the image from its URL and parse it with FileReader. However, this would incur a lot of overhead if every image has to be downloaded twice. Another option could have been to use the canvas, but that loses the exif data when converting.
You can do this in two ways: Load the image source using XMLHttpRequest() or fetch() instead of an image element. Convert image element via a canvas element. This will recompress the image causing some quality loss.
BW = im2bw( I , level ) converts the grayscale image I to binary image BW , by replacing all pixels in the input image with luminance greater than level with the value 1 (white) and replacing all other pixels with the value 0 (black).
BLOB DefinitionBLOB stands for a “Binary Large Object,” a data type that stores binary data. Binary Large Objects (BLOBs) can be complex files like images or videos, unlike other data strings that only store letters and numbers.
The general consensus seems to be summed up in this answer: Get image data in JavaScript?
So if you need the exif data, you'll need to use the XHR technique. Hopefully the browser will have the image cached, so it won't be too much of a performance hit. Otherwise the canvas technique should do the job.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With