Image is rotating when sending only in multipart post request to the backend server

Question

I am making a post request using multipart form-data. with the following code I can able to send the image but when I go the backend server and check, the image that I sent is rotating there . anyone have idea why it is happening ?

NSURL *reqUrl = [NSURL URLWithString:self.dataModel.apiUrl];
NSMutableURLRequest *request = [NSMutableURLRequest requestWithURL:reqUrl];
NSString *boundary = @"---------------------------14737809831466499882746641449";
NSString *contentType = [NSString stringWithFormat:@"multipart/form-data; boundary=%@",boundary];
[request addValue:contentType forHTTPHeaderField: @"Content-Type"];
[request setHTTPMethod:@"POST"];


NSDictionary *requestBody = self.dataModel.requestParams2;
UIImage *imageToUpload = [requestBody objectForKey:keyUploadImage];
    if(requestBody){
        NSMutableData *body = [NSMutableData data];
          float low_bound = 0;
    float high_bound =5000;
    float rndValue = (((float)arc4random()/0x100000000)*(high_bound-low_bound)+low_bound);//image1
    int intRndValue = (int)(rndValue + 0.5);
    NSString *str_image1 = [@(intRndValue) stringValue];


    NSData *imageData = UIImageJPEGRepresentation(imageToUpload, 0);
    [body appendData:[[NSString stringWithFormat:@"--%@\r\n", boundary] dataUsingEncoding:NSUTF8StringEncoding]];
    [body appendData:[[NSString stringWithFormat:@"Content-Disposition: form-data; name=\"uploadedfile1\"; filename=\"%@.jpeg\"\n",str_image1] dataUsingEncoding:NSUTF8StringEncoding]];
    [body appendData:[@"Content-Type: application/octet-stream\r\n\r\n" dataUsingEncoding:NSUTF8StringEncoding]];
    [body appendData:imageData];
    [body appendData:[@"\r\n" dataUsingEncoding:NSUTF8StringEncoding]];
    [body appendData:[[NSString stringWithFormat:@"--%@--\r\n", boundary] dataUsingEncoding:NSUTF8StringEncoding]];

    [request setHTTPBody:body];
}
   [request setHTTPShouldHandleCookies:NO];
   [request setTimeoutInterval:30];
[NSURLConnection sendAsynchronousRequest:request queue:[NSOperationQueue mainQueue]
                       completionHandler:^(NSURLResponse *response, NSData *data, NSError *error)

 {
              NSLog(@"completionHandler with response:%@",[NSHTTPURLResponse localizedStringForStatusCode:[(NSHTTPURLResponse*)response statusCode]]);
     NSLog(@"reponse: %ld",(long)[(NSHTTPURLResponse*)response statusCode]);

     NSInteger status = [(NSHTTPURLResponse*)response statusCode];

     if(error){
         NSLog(@"http request error: %@", error.localizedDescription);
         // handle the error
     }
     else{
         if (status == 200){
             // handle the success
         }
         else{
             NSLog(@"error");
         }   // handle the error
     }


     }];

[1]: https://i.stack.imgur.com/FAMJy.png ---This is the image in the server

[1]: https://i.stack.imgur.com/7NGSK.png --- This is the actual image that I want

@AndreasOetjen please read my question clearly, here I am sending in post request using multipart but not using image picker controller. And it is going properly for normal post request only in case of multipart image is rotating — iVJ, Jan 23 '18 at 13:59
I read this, but I assume that the original JPEG image is rotated somehow. JPEG stores the image orientation in EXIF metadata, but PNG does not. To test, you could just store the PNG to the local file system and see if it's also rotated "wrongly". Or, just send the PNG and not the JPEG to the server. — Andreas Oetjen, Jan 23 '18 at 14:19
I backend server accepts only jpeg format what to do for that and the same jpeg image data is going correctly in post request — iVJ, Jan 23 '18 at 14:23
Maybe I misread it. Nevertheless, you should check the orientation flag in the exif data both of font- and backend — Andreas Oetjen, Jan 23 '18 at 14:26
but how can you comment as duplicate without reading it properly ??strange — iVJ, Jan 23 '18 at 14:28

score 0 · Answer 1 · answered Jan 24 '18 at 05:48

0

you should remove orientation data from UIImage before uploading to the server.

UIImage *originalImage = [requestBody objectForKey:keyUploadImage];

UIImage *imageToUpload =
[UIImage imageWithCGImage:[originalImage CGImage]
                    scale:[originalImage scale]
              orientation: UIImageOrientationUp];

You should use imageToUpload to upload to the server.

answered Jan 24 '18 at 05:48

Milan Manwar

374
3
10

Could you just somehow send a link to both the original and the server image? – Andreas Oetjen Jan 24 '18 at 07:19
my image orientation is already in up but it gets rotated after upload and this happening only when I crop the image – iVJ Jan 24 '18 at 07:22
crop? Where do you crop the image, I cannot see it in your code. – Andreas Oetjen Jan 24 '18 at 07:35
crop that I am doing before this – iVJ Jan 24 '18 at 07:41
That's exactly what I told you at the very beginning. And you are not using jpeg but png format, which doesn't support image orientation. – Andreas Oetjen Jan 24 '18 at 08:06
I am using jpeg only – iVJ Jan 24 '18 at 08:22
The images you uploaded on imgur are png images; it could be helpful to see the images in jpeg format, exactly as they were sent to and received by the server – Andreas Oetjen Jan 24 '18 at 08:25
there I just added screenshots to show the rotation – iVJ Jan 24 '18 at 08:27
Unfortunately, screenshots are no help at all; I would need the orginal (cropped) jpeg image (`imageToUpload`) and the image that's stored on the server. – Andreas Oetjen Jan 25 '18 at 06:59

iVJ · Accepted Answer · 2018-09-24T09:43:55.840

0

the image rotation is happening when I crop the image then I used this https://stackoverflow.com/a/14231694/7636194 after cropping then my issue is got fixed.

edited Sep 24 '18 at 09:43

answered Jan 26 '18 at 10:02

iVJ

61
1
1
13

Image is rotating when sending only in multipart post request to the backend server

2 Answers2