How to upload a photo using NSURLConnection

01.28.2014

Here's a quick little tutorial for all you aspiring iOS developers.

When I first started developing iOS apps, jumping into something completely new (like, handling photo uploads) was always a huge challenge. Hopefully this will give you a head start if you're building an app that requires photo uploads—or any type of HTTP POST for that matter.

Before I go any further, I present the code:

    //Activate the status bar spinner
    UIApplication* app = [UIApplication sharedApplication];
    app.networkActivityIndicatorVisible = YES;
	
	//The image you want to upload represented in JPEG
	//NOTE: the 'selectedPhoto' needs to be replaced with the UIImage you'd like to upload	
    NSData *imageData = UIImageJPEGRepresentation(selectedPhoto, 1);
    
    //NOTE: Change this to the upload URL you're posting to
    NSString *uploadUrl = @"http://[YOUR UPLOAD URL]";
    
    NSMutableURLRequest *request = [[NSMutableURLRequest alloc] init];
    [request setURL:[NSURL URLWithString:uploadUrl]];
    [request setHTTPMethod:@"POST"];
    
    NSMutableData *body = [NSMutableData data];
    
    NSString *boundary = @"---------------------------14737809831466499882746641449";
    NSString *contentType = [NSString stringWithFormat:@"multipart/form-data; boundary=%@", boundary];
    [request addValue:contentType forHTTPHeaderField:@"Content-Type"];
    
    //The file to upload
    [body appendData:[[NSString stringWithFormat:@"--%@\r\n", boundary] dataUsingEncoding:NSUTF8StringEncoding]];
    [body appendData:[[NSString stringWithFormat:@"Content-Disposition: attachment; name=\"image\"; filename=\"image.jpg\"\r\n"] dataUsingEncoding:NSUTF8StringEncoding]];
    [body appendData:[@"Content-Type: application/octet-stream\r\n\r\n" dataUsingEncoding:NSUTF8StringEncoding]];
    [body appendData:[NSData dataWithData:imageData]];
    [body appendData:[@"\r\n" dataUsingEncoding:NSUTF8StringEncoding]];
    
    
    // close the form
    [body appendData:[[NSString stringWithFormat:@"--%@--\r\n", boundary] dataUsingEncoding:NSUTF8StringEncoding]];
    
    // set request body
    [request setHTTPBody:body];
    
    // Configure your request here.  Set timeout values, HTTP Verb, etc.
    NSURLConnection *connection = [NSURLConnection connectionWithRequest:request delegate:self];
    
    //start the connection
    [connection start];

    //Stop the status bar spinner
    app.networkActivityIndicatorVisible = NO;

I like to think of the above as just a webform (<form>). You're, in essence, setting up form fields. Here's a snippet of the above code:

    //The file to upload
    [body appendData:[[NSString stringWithFormat:@"--%@\r\n", boundary] dataUsingEncoding:NSUTF8StringEncoding]];
    [body appendData:[[NSString stringWithFormat:@"Content-Disposition: attachment; name=\"image\"; filename=\"image.jpg\"\r\n"] dataUsingEncoding:NSUTF8StringEncoding]];
    [body appendData:[@"Content-Type: application/octet-stream\r\n\r\n" dataUsingEncoding:NSUTF8StringEncoding]];
    [body appendData:[NSData dataWithData:imageData]];
    [body appendData:[@"\r\n" dataUsingEncoding:NSUTF8StringEncoding]];

The above represents a file <input>. We're setting a 'name', 'filename', and the data (or the value).

Upcoming: In a later blog, I'll show you how you can use the above upload method with a UIProgressView.