Add support for Exif tags in PNG images

Author: mattiasw

README.md

@@ -23,7 +23,7 @@ You can try it out on the
 | ----------|---------|---------|---------|---------|---------|-----------|
 | JPEG      | **yes** | **yes** | **yes** | **yes** | **yes** | **yes**   |
 | TIFF      | **yes** | **yes** | **yes** | **yes** | ???     | no        |
-| PNG       | no      | no      | **yes** | no      | no      | no        |
+| PNG       | **yes** | no      | **yes** | no      | no      | no        |
 | HEIC/HEIF | **yes** | no      | no      | **yes** | ???     | no        |
 | WebP      | **yes** | no      | **yes** | **yes** | ???     | **yes**   |
 

dist/exif-reader.js

@@ -23,6 +23,7 @@ export const TYPE_TEXT = 'tEXt';
 export const TYPE_ITXT = 'iTXt';
 export const TYPE_PHYS = 'pHYs';
 export const TYPE_TIME = 'tIME';
+export const TYPE_EXIF = 'eXIf';
 
 function isPngFile(dataView) {
     return !!dataView && getStringFromDataView(dataView, 0, PNG_ID.length) === PNG_ID;
@@ -61,6 +62,9 @@ function findPngOffsets(dataView) {
                 type: chunkType,
                 offset: offset + PNG_CHUNK_DATA_OFFSET
             });
+        } else if (isPngExifChunk(dataView, offset)) {
+            offsets.hasAppMarkers = true;
+            offsets.tiffHeaderOffset = offset + PNG_CHUNK_DATA_OFFSET;
         } else if (isPngChunk(dataView, offset)) {
             offsets.hasAppMarkers = true;
             if (!offsets.pngChunkOffsets) {
@@ -96,6 +100,10 @@ function isPngTextChunk(dataView, offset) {
     return chunkType === PNG_CHUNK_TYPE_TEXT || chunkType === PNG_CHUNK_TYPE_ITXT;
 }
 
+function isPngExifChunk(dataView, offset) {
+    return getStringFromDataView(dataView, offset + PNG_CHUNK_TYPE_OFFSET, PNG_CHUNK_TYPE_SIZE) === TYPE_EXIF;
+}
+
 function isPngChunk(dataView, offset) {
     const SUPPORTED_PNG_CHUNK_TYPES = [TYPE_PHYS, TYPE_TIME];
     const chunkType = getStringFromDataView(dataView, offset + PNG_CHUNK_TYPE_OFFSET, PNG_CHUNK_TYPE_SIZE);

dist/exif-reader.js.map

@@ -401,6 +401,25 @@ describe('image-header', () => {
             });
         });
 
+        it('should find eXIf chunks', () => {
+            const chunkData = '\x01\x02\x03';
+            const chunkLength = `\x00\x00\x00${String.fromCharCode(chunkData.length)}`;
+            const chunkType = 'eXIf';
+            const crcChecksum = '\x00\x00\x00\x00';
+
+            const dataView = getDataView(
+                PNG_IMAGE_START
+                + chunkLength + chunkType + chunkData + crcChecksum
+            );
+
+            const appMarkerValues = ImageHeader.parseAppMarkers(dataView);
+
+            expect(appMarkerValues).to.deep.equal({
+                hasAppMarkers: true,
+                tiffHeaderOffset: PNG_IMAGE_START.length + chunkLength.length + chunkType.length,
+            });
+        });
+
         it('should handle when PNG files have been excluded in a custom build', () => {
             ImageHeaderRewireAPI.__Rewire__('Constants', {USE_PNG: false});
             const dataView = getDataView(PNG_IMAGE_START);