How to read image metadata (HTML)
[This article is for Windows 8.x and Windows Phone 8.x developers writing Windows Runtime apps. If you’re developing for Windows 10, see the latest documentation]
We show you how to retrieve metadata from an image file. Image formats like JPEG, TIFF and PNG support a variety of embedded metadata that describe things like keywords, GPS location, and camera info. You can access commonly used imaging properties, and more advanced access to the raw metadata stored in formats such as EXIF and XMP.
There are two classes to access imaging metadata, depending on your scenario: Windows.Storage.FileProperties.ImageProperties and Windows.Graphics.Imaging.BitmapPropertiesView.
You can use BitmapPropertiesView to get Windows properties, like ImageProperties. But it provides lower level access to the native metadata structures in the file using the WIC metadata query language. Accessing native metadata is a more advanced scenario, but gives you access to more metadata than what is provided by the Windows property system.
What you need to know
Technologies
- Building your first Windows Windows Runtime app using JavaScript
- Windows.Storage.FileProperties.ImageProperties
- Windows.Graphics.Imaging
- Windows Imaging Component (WIC) metadata query language
Prerequisites
- We assume that you can create a basic Windows Runtime app using JavaScript. For more info, see Building your first Windows Windows Runtime app using JavaScript.
- You have created a StorageFile or BitmapDecoder object. How to decode an image walks you through that process of getting both.
Instructions
Step 1: Get a decoder object
Write the beginning of a function that receives a BitmapDecoder object and declare variables in which to store the retrieved properties.
(function (decoder) {
var orientation;
var xmpCreator;
Use the decoder to access the image metadata. If you don't have a decoder object yet, see How to decode an image. Declare the variables here to keep them in scope.
Step 2: Retrieve a Windows property
The BitmapDecoder class has a member BitmapProperties which is of type BitmapPropertiesView. Similar to ImageProperties, you can asynchronously request a supported Windows property by passing a list of property key names to bitmapProperties.getPropertiesAsync.
Note Not all properties are supported for every format. Photo Metadata Policies lists which image formats support each property.
return
decoder.bitmapProperties.getPropertiesAsync(["System.Photo.Orientation"])
.then(function(retrievedProps) {
BitmapPropertiesView behaves differently from ImageProperties in a few important ways:
- You must check that a property exists before you retrieve it from the collection. The method returns an error if the property doesn’t exist.
- Each property value is of type BitmapTypedValue. This object has a Value member containing the actual data and a Type member, which indicates the data.
- BitmapPropertiesView returns an error if the image format doesn’t support a property you requested. You either need to handle these errors, or ensure that your code requests only properties that the image format supports. For example, BMP files don’t contain any metadata.
This is how you look up a property:
if (retrievedProperties.hasKey("System.Photo.Orientation") {
orientation = retrievedProperties.lookup("System.Photo.Orientation").value;
}
}, function (error) {
switch (error.number) {
case -2003292287:
// The image format does not support this property.
break;
case -2003292287:
// The image format does not support metadata.
break;
default:
// Catch any other errors.
break;
}
});
Step 3: Retrieve native image metadata
While ImageProperties is limited to Windows properties, BitmapPropertiesView gives you access to most of the metadata stored within an image. For a list of metadata formats supported by each bitmap codec, see Native Image Format Metadata Queries.
You use the WIC metadata query language to look up properties similar to how you use System.Photo Properties. You replace the property name with a metadata query string.
Replace the code you wrote in Step 2 with this code:
return decoder.bitmapProperties.getPropertiesAsync(["/xmp/dc:creator"])
.then(function(retrievedProps) {
if (retrievedProperties.hasKey("/xmp/dc:creator") {
xmpCreator = retrievedProperties.lookup("/xmp/dc:creator").value;
}
}, function (error) {
switch (error.number) {
case -2003292287:
// The image format does not support this property.
break;
case -2003292287:
// The image format does not support metadata.
break;
default:
// Catch any other errors.
break;
}
});
This particular code snippet requests the creator metadata as defined by the Dublin Core XMP schema. The query "/xmp/dc:creator" is valid only for JPEG images. For example, TIFF images also support XMP metadata, but the equivalent TIFF query is "/ifd/xmp/dc:creator".