Images turn sideways when uploaded

Hi everyone,

When accessing my app from an iPhone and uploading images shot on iPhone, the images turn sideways IF I select Small, Medium or Large before uploading. If I chose “Actual size” the image gets uploaded with the correct orientation.
I’m using the “file uploader” element.

Does anyone know how to solve this issue? Thanks

It looks like the same (or a similar) problem has been around for a while:

EDIT:
I’ve found this on an online forum:


While this isn’t an answer in itself, it may be helpful to know there are two ways in which a camera can apply rotation to images it records when it detects it’s being held in portrait:

  • Swap the width and height, and move all the pixels.
  • Leave the image the “wrong” way up but add metadata noting it should be rotated when displayed.

The iPhone does the latter, which is fine most of the time because other apps and websites know to look for the orientation metadata when reproducing the image. But sometimes:

  • The metadata gets removed along the way when exporting, uploading etc. the image.
  • The app or website displaying the image wasn’t designed to understand the metadata.

I guess the metadata gets stripped out when choosing to resize the image?
Because Bubble is able to understand the orientation when the image is uploaded without resizing.
But why would iOS prompt the options to chose to resize the file, if it were to remove the orientation meta data by doing so?

UPDATE:

I have done a bit of testing:

I checked the metadata of the original image file (.heic) and it contains the info about the orientation:
orientation: Rotate 90 CW

I have then checked the metadata of the file uploaded on Bubble, after selecting “small size” on iOS at the time of upload.
The file got converted the .jpg and it DOES NOT contain the metadata info about the orientation.

I have then emailed to myself the same image from iPhone. Selected “small size” when mail app asked me to choose the file size.
The image arrived converted to .jpg, but this time, IT DOES have the metadata info about the orientation, and it’s displayed correctly.

So the metadata info about the orientation gets lost when the file is uploaded on Bubble.
Any chance this can be fixed by Bubble team?

Thanks

This topic was automatically closed after 14 days. New replies are no longer allowed.