我有一个 HTML 文件控件,我正在尝试在服务器上上传文件。
- 点击文件控制
- 它将自动打开文件/相机选择对话框。
- 我选择相机
- 我拍了照片并保存了
- 现在提交表格
- 拍摄的照片成功保存在服务器上,但旋转了 90 学位。
此问题仅适用于 iPhone 或 IOS。
<input id="image" name="image" type="file" accept="image/*" capture style="width: 58px" />
请告诉我,如果从相机捕获图像,如何停止自动旋转。
谢谢, 伊姆达胡森
最佳答案
这可能与图像中的 EXIF/TIFF 元标记有关。
其中一个标签指示图像的方向。您上传到服务器的一些照片(例如从 iPhone)可能有这些标签,其他照片(来自不同的来源/工作流程)可能没有。服务器可能会或可能不会保留这些标签,并且可能会或可能不会读取标签以尝试正确定位图像。同样,Web 浏览器可能会或可能不会注意这些标签。如果上传包含标签的图片,结果肯定是不可预知的。
查明这是否是问题的一个好方法是从服务器下载“问题”图像和“良好”图像,然后比较它们。在预览中打开它们并检查检查器的第二个选项卡。任何元信息都将显示在那里。查看一张图片是否有方向信息而另一张没有。如果两者都不显示元信息,那么服务器很可能将其全部剥离而不使用它,您可以忘记这个答案。
您还应该在不同的浏览器中进行比较。一些浏览器会读取此方向信息并相应地旋转图像,而其他浏览器则不会。
例如,我在 iPhone 上拍摄的一张人像模式照片具有以下元标记:
- 像素高度:2,448
- 像素宽度:3,264
- 方向:6(逆时针旋转 90°)
原生位图方向是横向。
'orientation'元标记指示图像读取软件旋转到纵向以进行显示。
(某些)图像软件使用元标记将图像“正确”旋转为纵向,但会被其他将图像显示为横向的软件忽略。
情况令人困惑,并且没有针对此的既定标准(标签只是一个提示),因此在为在线出版物准备图像时,最安全的做法是去除这些标签并将图像物理旋转到正确的 BITMAP上传前的方向。如果您正在编写应用程序的服务器端,您可以在服务器上执行此操作。但以正确的 BITMAP 方向将图像传送到网络浏览器非常重要,没有方向元标记。
这是为什么?因为即使在今天,不同的浏览器也对元标记采用不同的方法。
刚才提到的iPhone图片显示如下:
Google Chrome 24 纵向
Safari 6 纵向
Firefox 17 横向
歌剧 12 风景
这不是什么好事!
关于ios - 在 IOS 6.0 或 iPhone 中上传时拍摄的照片自动旋转,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13971491/