1

在 Safari iOS 中,已知问题是使用相机拍摄的大图像上设置了 exif 方向标志,这会导致查看时图像的方向不正确。例如,如果 iPhone 处于纵向并拍摄照片,则生成的图像将看起来像旋转到横向。已创建名为 megapix-image.js 和 exif.js 的 Jquery 插件来处理这种情况,方法是检测相机图像上的 exif 方向标志并自动旋转图像以进行补偿。我在我的 Web 应用程序中使用它,它在客户端运行良好,但我遇到的问题是我需要将旋转后的图像返回到服务器。发送回服务器的图像是输入类型=文件控件中的图像。这是 megapix-image 用来旋转图像的图像来源。我需要做的是用旋转的图像替换存储在 input type=file 控件中的图像,这样它将是被上传的图像。换句话说,只是在客户端旋转图像没有任何价值,只是让用户暂时看到图像的方向与他们用相机拍照时的方向相同。最重要的是旋转后的图像被上传回服务器。我希望我的措辞清楚并且有道理。如何将旋转后的图像放回输入 type=file 控件中,这样它将是上传的图像,而不是方向不正确的图像?我需要做的是用旋转的图像替换存储在 input type=file 控件中的图像,这样它将是被上传的图像。换句话说,只是在客户端旋转图像没有任何价值,只是让用户暂时看到图像的方向与他们用相机拍照时的方向相同。最重要的是旋转后的图像被上传回服务器。我希望我的措辞清楚并且有道理。如何将旋转后的图像放回输入 type=file 控件中,这样它将是上传的图像,而不是方向不正确的图像?我需要做的是用旋转的图像替换存储在 input type=file 控件中的图像,这样它将是被上传的图像。换句话说,只是在客户端旋转图像没有任何价值,只是让用户暂时看到图像的方向与他们用相机拍照时的方向相同。最重要的是旋转后的图像被上传回服务器。我希望我的措辞清楚并且有道理。如何将旋转后的图像放回输入 type=file 控件中,这样它将是上传的图像,而不是方向不正确的图像?只是在客户端旋转图像没有任何价值,只是让用户暂时看到图像的方向与他们用相机拍照时的方向相同。最重要的是旋转后的图像被上传回服务器。我希望我的措辞清楚并且有道理。如何将旋转后的图像放回输入 type=file 控件中,这样它将是上传的图像,而不是方向不正确的图像?只是在客户端旋转图像没有任何价值,只是让用户暂时看到图像的方向与他们用相机拍照时的方向相同。最重要的是旋转后的图像被上传回服务器。我希望我的措辞清楚并且有道理。如何将旋转后的图像放回输入 type=file 控件中,这样它将是上传的图像,而不是方向不正确的图像?

编辑:

我在各种设备上进行了更多测试:在运行 iOS 7 的 iPhone4、运行 iOS 7 的 iPad 和运行 iOS 6 的 iPad 上,通过 input type=file 控件在 Safari 和服务器上都存在方向问题。iPhone4 和 iPad 上的 iOS 7 中修复了垂直挤压/二次采样问题。在运行 iOS 7 的 iPhone 5C 上,Safari 中的方向正确,但存在垂直挤压/二次采样问题。

4

1 回答 1

2

该问题已解决如下:

正如上面 Ray Nicholus 所说,您无法在文件控件内部修改图像文件数据,因此无论做什么都必须在服务器端完成。以下是我创建的用于更改图像方向服务器端的 VB.Net 代码,它运行良好。基本上它会通过将任何图像旋转到正确的方向来自动校正任何图像,使其看起来正确:

  Public Function TestRotate(sImageFilePath As String) As Boolean
    Dim rft As RotateFlipType = RotateFlipType.RotateNoneFlipNone
    Dim img As Bitmap = Image.FromFile(sImageFilePath)
    Dim properties As PropertyItem() = img.PropertyItems
    Dim bReturn As Boolean = False
    For Each p As PropertyItem In properties
      If p.Id = 274 Then
        Dim orientation As Short = BitConverter.ToInt16(p.Value, 0)
        Select Case orientation
          Case 1
            rft = RotateFlipType.RotateNoneFlipNone
          Case 3
            rft = RotateFlipType.Rotate180FlipNone
          Case 6
            rft = RotateFlipType.Rotate90FlipNone
          Case 8
            rft = RotateFlipType.Rotate270FlipNone
        End Select
      End If
    Next
    If rft <> RotateFlipType.RotateNoneFlipNone Then
      img.RotateFlip(rft)
      System.IO.File.Delete(sImageFilePath)
      img.Save(sImageFilePath, System.Drawing.Imaging.ImageFormat.Jpeg)
      bReturn = True
    End If
    Return bReturn

  End Function
于 2013-10-11T20:36:50.760 回答