Does canvas ImageData in JavaScript contain EXIF info?

Question

From the Docs

ImageData interface represents the underlying pixel data of an area of a canvas element

I would like to know does ImageData will have only pixel data or pixel data + meta data? Meta data means any EXIF data like orientation, resolution, file type or dpi.

Problem

Whenever I draw images with EXIF Orientation other than 1 to canvas and read it back as ImageData, the resulted ImageData is not properly aligning on Image tag when I am converting ImageData to DataURL.

Issue is observed both in mobile as well as desktop browsers all most all browsers.

Answer 1

<canvas> does not preserve any JPEG metadata, as this metadata is specific to JPEG file itself. Canvas, by definition, is raw pixel data only.

• Parse JPEG file yourself to extract metadata

• Play with canvas

• Use a custom encoder to write JPEG file out of canvas, injecting extracted EXIF metadata back.