在 IOS 6.0 或 iPhone 中上传时自动旋转拍摄的照片

Question

我有一个 HTML 文件控件，我正在尝试在服务器上上传文件。

• 点击文件控制
• 它将自动打开文件/相机选择对话框。
• 我选择相机
• 我拍了照片并保存了
• 现在提交表单
• Capture 照片在服务器上成功保存，但旋转了 90 学位。

此问题仅适用于 iPhone 或 IOS。

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

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

谢谢， 伊姆达杜森

Answer 1

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

其中一个标签指示图像的方向。您上传到服务器的一些照片（例如从 iPhone）可能有这些标签，而其他照片（来自不同的来源/工作流程）可能没有。服务器可能会或可能不会保留这些标签，并且可能会或可能不会读取标签以尝试正确定位图像。同样，网络浏览器可能会也可能不会关注这些标签。如果上传包含标签的图片，结果肯定是不可预知的。

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

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

例如，我的一张 iPhone 纵向模式照片具有以下元标记：

• 像素高度：2,448
• 像素宽度：3,264
• 方向：6（逆时针旋转 90°）

本机位图方向是横向。
“方向”元标记指示图像读取软件旋转到纵向进行显示。

元标签被（某些）图像软件用来“正确”将图像旋转为纵向，但被其他软件忽略，将图像显示为横向。

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

这是为什么？因为即使在今天，不同的浏览器也对元标记采取不同的方法。

我刚才提到的 iPhone 图片显示如下：
Google Chrome 24 纵向
Safari 6 纵向
Firefox 17 横向
Opera 12 风景

情况不是很好！