Hackszine.com: Reading EXIF data from images in Javascript

Reading EXIF data from images in Javascript

Jacob Seidelin figured out a way to obtain EXIF data from images in Javascript, allowing AJAX applications to pull information about the make and model of camera used, as well as any aperture, focal length, or description information that may have been tagged to an image by the camera or a photo editor.

The exif.js javascript library scans through all IMG tags in your HTML document, looking for the custom exif="true" parameter to be set. The DOM image object doesn't contain the necessary raw image data, so XMLHttpRequest is used to fetch the image data. In Safari and Firefox, the responseText property contains the binary image data. This isn't available in IE, however, but Jacob was able to put together a VBScript alternative that is still able to pull the data from the response.

From your code, pulling the EXIF data for an image becomes as simple as this:

var theimg = document.getElementById("imageid");
alert("Image Make: " + EXIF.getTag(theimg, "Make") + "\nImage Model: " + EXIF.getTag(theimg, "Model"));

How cool is that? I expect we'll see this in every ajax photo gallery soon.

Reading EXIF data with Javascript

Posted by Jason Striegel | May 10, 2008 08:52 PM
Ajax, Photography | Permalink | Comments (1)