Image CDN rotating images

Support
1

Hello. I want to start using Netlify image CDN to serve images on my website. I’m trying to serve images from an external website via CDN. However for some reason when the images go through the CDN they get rotated if they are landscape images. Here’s an example:

If we take image: https://drive.usercontent.google.com/download?id=1tlKPARh4_YwL8bUHYR9rkbfBbJvcvpsm

And try to open it like so
https://main--netlify-image-issue.netlify.app/.netlify/images?url=https://drive.usercontent.google.com/download%3Fid=1tlKPARh4_YwL8bUHYR9rkbfBbJvcvpsm

It is rotated 90 degrees.

I tried with a portrait image from a different source and couldn’t reproduce, so I’m guessing it’s related to how Google drive is serving images, but not sure what could be done.

I also observed that it starts rotating in different directions, on different deploys. One it starts it consistently rotates them in the same direction.

Requesting a different encoding seems to also affect the rotation, in JPEG the image is upside down instead of sideways: https://main--netlify-image-issue.netlify.app/.netlify/images?url=https://drive.usercontent.google.com/download%3Fid=1tlKPARh4_YwL8bUHYR9rkbfBbJvcvpsm&fm=jpg

5

@AugustinGrigorov This is likely due to the exif data orientation within that particular image.

If you haven’t already, you could try inspecting that, what the value is, if it’s the same/different from your other images and if adjusting it has an impact.

1 Like
6

Hey Nathan, thanks for your reply.
I just checked both the original and the one served by Netlify, using: https://exifmeta.com/

both report Orientation: 6

The image is a direct upload from a phone camera, I have tried both Samsung and iPhone and I can consistently reproduce with both.

Let me know if you have any other ideas.

7

@AugustinGrigorov No other ideas needed, as I’m still fairly confident it’s the root cause.

Note, I’m not suggesting…

  • That Netlify’s image CDN is or isn’t modifying the orientation exif value
  • That the Netlify behavior is ‘correct’
  • That it’s up to you to fix
    etc

I’m just providing a pointer as to the likely cause, and something you and Netlify can investigate.

An orientation of 6 is:

90 degrees, mirrored

image
image968×954 134 KB

When I upload that image into this tool I also see it rotated 90 degrees, albeit the other way:

image
image815×527 62.1 KB

1 Like
8

Hey @AugustinGrigorov

sorry for the trouble with the Image CDN feature. We’ve recently made some changes to the feature, but i’ve now excluded you from the rollout of those changes.

Can you check if you’re still running into problems or if everything works as expected? You might need to redeploy the site for caches to be invalidated

2 Likes
9

Yep, can confirm it works now! Thanks, you guys are amazing!