An application I'm developing has the requirement to correctly handle EXIF images in Google Chrome. Here's an example image:
View on Github | View in browser
If you click the "view in browser link" above and you are in google chrome, the image will be correctly rotated; "top" in the image will be at the top instead of at the left.
If you open developer tools when viewing the image on Chrome directly, you see a source like:
<body style="margin: 0px; background: #0e0e0e;">
<img
style="-webkit-user-select: none;background-position: 0px 0px, 10px 10px;background-size: 20px 20px;background-color: white;background-image:linear-gradient(45deg, #eee 25%, transparent 25%, transparent 75%, #eee 75%, #eee 100%),linear-gradient(45deg, #eee 25%, transparent 25%, transparent 75%, #eee 75%, #eee 100%);"
src="https://raw.githubusercontent.com/recurser/exif-orientation-examples/master/Portrait_6.jpg">
</body>
If you make a fiddle from that source, the image is rotated!
How is Chrome handling EXIF when an image is opened directly? Is it possible to do this on my own site?
