在IOS 6.0或iPhone上传时,捕获的照片会自动旋转

Question

我有一个HTML文件控件使用这个我试图在服务器上传文件.

• 单击文件控件
• 它将自动打开文件/摄像机选择对话框.
• 我选择相机
• 我拍摄照片并保存
• 现在提交表格
• Capture照片在服务器上成功保存但旋转90度.

此问题仅适用于iPhone或IOS.

<input id="image" name="image" type="file" accept="image/*" capture style="width: 58px" />

请告诉我,如果从相机捕获图像,如何停止自动旋转图像.

谢谢,Imdadhusen

Answer 1

这可能与图像中的EXIF/TIFF元标记有关.

其中一个标签表示图像的方向.您上传到服务器(例如来自iPhone)的某些照片可能包含这些标签,而其他照片(来自不同的来源/工作流程)可能没有.服务器可以保留或不保留这些标签,并且可以读取或不读取标签以尝试正确定向图像.类似地,Web浏览器可能会或可能不会关注这些标记.如果您上传包含标签的图片,结果肯定是不可预测的.

找出问题的好方法是从服务器下载"问题"图像和"好"图像,并进行比较.在预览中打开它们并检查Inspector的第二个选项卡.任何元信息都会显示在那里.查看一个图像是否有方向信息而另一个图像没有.如果两者都没有显示元信息,那么很可能服务器正在全部剥离并且不使用它,您可以忘记这个答案.

您还应该在不同的浏览器中进行比较 某些浏览器会读取此方向信息并相应地旋转图像,而其他浏览器则不会.

例如,我的iPhone照片采用纵向模式,具有以下元标记:

• 像素高度:2,448
• 像素宽度:3,264
• 方向:6(旋转90°CCW)

原生位图方向是横向的.
'orientation'元标记表示将图像读取软件旋转为纵向以供显示.

(某些)图像软件使用元标记"正确"将图像旋转为纵向,但被其他软件忽略,这些软件将图像显示为横向.

情况令人困惑,并且没有确定的标准(标签只是一个提示),因此在为在线出版物准备图像时,最安全的做法是剥离这些标签并在上传之前将图像物理旋转到正确的BITMAP方向.如果您正在编写应用程序的服务器端,则可以在服务器上执行此操作.但是,在没有方向元标记的情况下,以正确的BITMAP方向将图像传送到Web浏览器至关重要.

为什么是这样？因为即使在今天,不同的浏览器也采用不同的元标记方法.

我刚才提到的iPhone图像显示如下:
谷歌Chrome 24 肖像
Safari 6 肖像
Firefox 17 景观
Opera 12 景观

不是很好的事态!