Menu
I have one HTML file control using this i am trying to upload file on server.
This problem is only with iPhone or IOS.
<input id="image" name="image" type="file" accept="image/*" capture style="width: 58px" />
Please let me know, how to stop automatic rotation of image if captured from camera.
Thanks, Imdadhusen
898
Photos taken with a smartphone or digital camera contain “Exif data,” all sorts of information about where the photo was taken, when it was taken, and even how the camera was oriented. When uploaded to File Manager, this data is preserved, and that can often cause the orientation of the picture to be rotated.
Swipe down from the top-right corner of your screen to open Control Center. Tap the Portrait Orientation Lock button to make sure that it's off.
The reason your photo would appear this way is because the photo was taken that way (either with the phone sideways or upside down) and the image file itself is in this orientation. For example, if you hold your phone upright and take a photo, the photo is saved in portrait mode or "sideways".
Right-click the image and select Details to reveal a screen with metadata, including EXIF data, that you can adjust if the image supports it. Force a preferred orientation. Rotate the image, then save it. That process reconstructs the image along the requested dimensions.
This could have something to do with EXIF/TIFF metatags in the images.
One of these tags indicates the orientation of the image. Some photos you upload to a server (eg from the iPhone) may have these tags, others (from a different source / workflow) may not. The server may or may not retain these tags, and may or may not read the tags in order to attempt correct orientation of the image. Similarly a web browser may or may not pay attention to these tags. If you upload images containing tags, the results will certainly be unpredictable.
A good way to find out if this is the issue would be to download a 'problem' image and a 'good' image from the server, and compare them. Open them in preview and check the second tab of the Inspector. Any meta-info will be displayed there. See if one image has orientation info and the other not. If neither display meta-info then it is fairly likely the server is stripping it all out and not using it, and you can forget about this answer.
Also you should compare in different browsers. Some browsers read this orientation info and rotate the image accordingly, others do not.
For example, an iPhone photo of mine which was take in portrait mode has the following metatags:
The native bitmap orientation is landscape.
The 'orientation' metatag indicates to image reading software to rotate to portrait for display.
The metatag is used by (some) image software to 'correctly' rotate the image to portrait but ignored by other software which will display the image as landscape.
The situation is confusing and there is no established standard for this (the tags are just a hint), so when preparing images for an online publication the safest thing is to strip out these tags and physically rotate the image to the correct BITMAP orientation before uploading. If you are writing the server side of an app you could do this on the server. But it is vital to deliver images to a web browser in the correct BITMAP orientation with no orientation metatags.
Why is this? Because even today different browsers take different approaches to metatags.
The iPhone image I just mentioned displays as follows:
Google Chrome 24 portrait
Safari 6 portrait
Firefox 17 landscape
Opera 12 landscape
Not a great state of affairs!
126
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
