iPhoneにカメラの画像をアップロードすると、ウェブにアップロードされます

Question

私はUIImagePickerControllerを使って写真をポートレートモードでiPhoneに保存し、ウェブに保存しています。写真は携帯電話で肖像画に表示されますが、Web上で90度回転します。

プレビュー（mac）またはPhotoshop（macまたはpc）で写真をダウンロードして見ると、再びポートレートになります。 Windowsピクチャビューア（PC）では、それは横に回転しています。

アップロードする前に画像データに回転変換を適用する必要がありますか？また、Photoshopやプレビューで回転させているメタデータを削除する必要がありますか？

Answer 1

問題は、画像の回転がほとんどのブラウザでは使用されていないEXIFデータとして写真に追加されたことでした。 2つのソリューションがあります。

1. サーバー側でローテーションを適用します。私はRubyのプラグインPaperclip（Thoughtbot）を使っていましたが、モデルのhas_attached_fileコマンドにauto-orient convertオプションを含めるだけでした。

   has_attached_file：photo、：convert_options => {：all => '-auto -orient '}

2. 写真をiPhoneアプリ内で回転します。これは別のstackoverflowの質問で解決されました。 scaleAndRotate methodを呼び出すと、@Squeegyのおかげでローテーションメタデータがイメージトランスフォームに置き換えられます。ここで

Answer 2

はCarrierWavew/MiniMagickのためのソリューションです：あなたがサーバに画像をアップロードする前に写真を撮ったらhttp://carrierwave.rubyforge.org/rdoc/classes/CarrierWave/MiniMagick.html

Answer 3

はちょうど方法にあなたの撮影した画像を渡し、その確か

のために働きます

#pragma mark Rotate 
- (UIImage *)scaleAndRotateImage:(UIImage *)image { 
    int kMaxResolution = 640; // Or whatever 

    CGImageRef imgRef = image.CGImage; 

    CGFloat width = CGImageGetWidth(imgRef); 
    CGFloat height = CGImageGetHeight(imgRef); 


    CGAffineTransform transform = CGAffineTransformIdentity; 
    CGRect bounds = CGRectMake(0, 0, width, height); 
    if (width > kMaxResolution || height > kMaxResolution) { 
     CGFloat ratio = width/height; 
     if (ratio > 1) { 
      bounds.size.width = kMaxResolution; 
      bounds.size.height = roundf(bounds.size.width/ratio); 
     } 
     else { 
      bounds.size.height = kMaxResolution; 
      bounds.size.width = roundf(bounds.size.height * ratio); 
     } 
    } 

    CGFloat scaleRatio = bounds.size.width/width; 
    CGSize imageSize = CGSizeMake(CGImageGetWidth(imgRef), CGImageGetHeight(imgRef)); 
    CGFloat boundHeight; 
    UIImageOrientation orient = image.imageOrientation; 
    switch(orient) { 

     case UIImageOrientationUp: //EXIF = 1 
      transform = CGAffineTransformIdentity; 
      break; 

     case UIImageOrientationUpMirrored: //EXIF = 2 
      transform = CGAffineTransformMakeTranslation(imageSize.width, 0.0); 
      transform = CGAffineTransformScale(transform, -1.0, 1.0); 
      break; 

     case UIImageOrientationDown: //EXIF = 3 
      transform = CGAffineTransformMakeTranslation(imageSize.width, imageSize.height); 
      transform = CGAffineTransformRotate(transform, M_PI); 
      break; 

     case UIImageOrientationDownMirrored: //EXIF = 4 
      transform = CGAffineTransformMakeTranslation(0.0, imageSize.height); 
      transform = CGAffineTransformScale(transform, 1.0, -1.0); 
      break; 

     case UIImageOrientationLeftMirrored: //EXIF = 5 
      boundHeight = bounds.size.height; 
      bounds.size.height = bounds.size.width; 
      bounds.size.width = boundHeight; 
      transform = CGAffineTransformMakeTranslation(imageSize.height, imageSize.width); 
      transform = CGAffineTransformScale(transform, -1.0, 1.0); 
      transform = CGAffineTransformRotate(transform, 3.0 * M_PI/2.0); 
      break; 

     case UIImageOrientationLeft: //EXIF = 6 
      boundHeight = bounds.size.height; 
      bounds.size.height = bounds.size.width; 
      bounds.size.width = boundHeight; 
      transform = CGAffineTransformMakeTranslation(0.0, imageSize.width); 
      transform = CGAffineTransformRotate(transform, 3.0 * M_PI/2.0); 
      break; 

     case UIImageOrientationRightMirrored: //EXIF = 7 
      boundHeight = bounds.size.height; 
      bounds.size.height = bounds.size.width; 
      bounds.size.width = boundHeight; 
      transform = CGAffineTransformMakeScale(-1.0, 1.0); 
      transform = CGAffineTransformRotate(transform, M_PI/2.0); 
      break; 

     case UIImageOrientationRight: //EXIF = 8 
      boundHeight = bounds.size.height; 
      bounds.size.height = bounds.size.width; 
      bounds.size.width = boundHeight; 
      transform = CGAffineTransformMakeTranslation(imageSize.height, 0.0); 
      transform = CGAffineTransformRotate(transform, M_PI/2.0); 
      break; 

     default: 
      [NSException raise:NSInternalInconsistencyException format:@"Invalid image orientation"]; 

    } 

    UIGraphicsBeginImageContext(bounds.size); 

    CGContextRef context = UIGraphicsGetCurrentContext(); 

    if (orient == UIImageOrientationRight || orient == UIImageOrientationLeft) { 
     CGContextScaleCTM(context, -scaleRatio, scaleRatio); 
     CGContextTranslateCTM(context, -height, 0); 
    } 
    else { 
     CGContextScaleCTM(context, scaleRatio, -scaleRatio); 
     CGContextTranslateCTM(context, 0, -height); 
    } 

    CGContextConcatCTM(context, transform); 

    CGContextDrawImage(UIGraphicsGetCurrentContext(), CGRectMake(0, 0, width, height), imgRef); 
    UIImage *imageCopy = UIGraphicsGetImageFromCurrentImageContext(); 
    UIGraphicsEndImageContext(); 

    return imageCopy; 
} 

Answer 4

MS Windowsでイメージが正しい向きで保存されている場合は、EXIFローテーションメタデータを手動で上書きする簡単な方法があります。 Windowsエクスプローラで、画像ファイルを右クリックし、「時計回りに回転」を選択します。これを4回行い、画像を一周させると、画像はすべてのシステムで正しい向きになります。その後、あなたのWebサーバーに画像をアップロードすることができます。