Chrome Image EXIF Orientation Issue

google-chrome firefox browser exif
Ido Ran picture Ido Ran · Feb 22, 2017 · Viewed 17.4k times · Source

I'm building a web app that shows pictures. Most of the pictures were taken by smart phones and have EXIF rotation information. I'm exposing a url which return the image blob without modification.

I've notice that when I put this url in img tag Chrome does not respect the EXIF orientation data but when I put the url in chrome address bar it show a page with the image and then it does respect the EXIF orientation.

Sorry I can't share the image, I'll try to find another example that I can share.

Has anyone notice this problem?

Answer

Sebastian Tschan picture Sebastian Tschan · Feb 24, 2017

The reason for this behavior is that Chrome auto-rotates pictures based on EXIF data only if they are displayed directly in a browser tab as the main document.

The relevant chromium issue that tracked this implementation is the following: https://bugs.chromium.org/p/chromium/issues/detail?id=56845

In the future, Chrome (and other browsers) will allow developers to enable auto-rotation also for images displayed via img tags with the CSS image-rotation property: https://bugs.chromium.org/p/chromium/issues/detail?id=158753

Related questions

How to manually send HTTP POST requests from Firefox or Chrome browser?

I want to test some URLs on a web application I'm working on. For that I would like to manually create HTTP POST requests (meaning I can add whatever parameters I like). Is there any extension or functionality in Chrome …

Read More
How to debug Angular JavaScript Code

I am working on a proof of concept using Angular JavaScript. How to debug the Angular JavaScript code in different browsers (Firefox and Chrome) ?

Read More
Edit and replay XHR chrome/firefox etc?

I've been looking for a way to alter a XHR request made in my browser and then replay it again. Say I have a complete POST request done in my browser, and the only thing I want to change is …

Read More