POST請求上傳多張圖片並攜帶參數

POST請求上傳多張圖片並攜帶參數

在iOS中,用POST請求攜帶參數上傳圖片是非常惡心的事情,HTTPBody部分完全需要我們自己來配置,這個HTTPBody分為3個部分,頭部分可以攜帶參數,中間部分就是我們要傳輸的圖片文件,尾部就是結束標識了,這些設置完了還不夠,你還需要配置一下HTTPHeaderField中的Content-Length以及Content-Type,恐怕一般人都會頭大:).

完整的HTTPBody解密出來后是下面的格式:

--AaB03x
Content-Disposition: form-data; name="appkey"

peixunduoduo
--AaB03x
Content-Disposition: form-data; name="content"

真心太好用了!
--AaB03x
Content-Disposition: form-data; name="userid"

101
--AaB03x
Content-Disposition: form-data; name="sumscore"

4
--AaB03x
Content-Disposition: form-data; name="courseid"

642
--AaB03x
Content-Disposition: form-data; name="fromapp"

2
--AaB03x
Content-Disposition: form-data; name="sign"

003a0d94aff1c7728ab21eb785fbd544
--AaB03x
Content-Disposition: form-data; name="timestamp"

1404373862


--AaB03x
Content-Disposition: form-data; name="image1"; filename="1.png"
Content-Type: image/png


<89504e47 0d0a1a0a 0000000d 49484452 000000c9 000000b9 08060000 0082e41b c4000000 1c69444f 54000000 02000000 00000000 5d000000 28000000 5d000000 5c000030 914514f9 44000030 5d494441 547801ec 7d0b7015 55ba2eea 8ce7a8e3 191d9ff8 0221ec50 35a335b7 4a92ec47 928d2373 4818e7e8 301254d4 0113f50e 09e21c08 1ec34b04 026a8023 210e11a3 189084b9 046a02c5 4b86644c 8e922a42 098c12ca 70490e82 6e2f8178 cd78bb4b 27c7f7fb 0d924e76 26c49c01 ecfdd078 fa059f2f fe098124 c4385d62 1c5f0c75 2dde0f81 e42a8384 8db86b91 b1aea53e 85401202 4908a401 78200492 0003d4d3 12d1a949 44a83850 ba00f69b ed439299 be63b7a7 db792dd1 e7310e14 b2d7fbfb ff017ed5 ee545a48 12fc0000 00004945 4e44ae42 6082>


--AaB03x--

本人封裝好了上傳圖片的類,源碼如下:

NETWorkPicUpload.h

//
//  NETWorkPicUpload.h
//  UploadPics
//
//  Copyright (c) 2014年 Y.X. All rights reserved.
//

#import <Foundation/Foundation.h>

// 創建pictures數組需要的數據
NSData * createPNGPicture(NSString *formBoundary, UIImage *image,
                          NSString *name,         NSString *filename);

@interface NETWorkPicUpload : NSObject

@property (nonatomic, strong) NSString       *boundary;    // 分割字符串
@property (nonatomic, strong) NSDictionary   *parameters;  // 攜帶的參數
@property (nonatomic, strong) NSArray        *pictures;    // 封裝好的圖片的數據

- (void)configRequest:(NSMutableURLRequest **)request;

@end

NETWorkPicUpload.m

//
//  NETWorkPicUpload.m
//  UploadPics
//
//  Copyright (c) 2014年 Y.X. All rights reserved.
//

#import "NETWorkPicUpload.h"

@implementation NETWorkPicUpload

#pragma mark - 創建圖片POST頭部信息
- (NSData *)createParametersData
{
    // 生成了頭部信息
    NSString        *start = [NSString stringWithFormat:@"--%@", _boundary];
    NSMutableString *body  = [[NSMutableString alloc] init];
    NSArray         *keys  = [_parameters allKeys];
    
    [keys enumerateObjectsUsingBlock:^(id obj, NSUInteger idx, BOOL *stop) {
        NSString *key = keys[idx];
        
        [body appendFormat:@"\r\n%@\r\n", start];
        [body appendFormat:@"Content-Disposition: form-data; name=\"%@\"\r\n\r\n", key];
        [body appendFormat:@"%@",_parameters[key]];
    }];
    
    return [body dataUsingEncoding:NSUTF8StringEncoding];
}

#pragma mark - 創建圖片POST尾部信息
- (NSData *)createEndData
{
    NSString *end = [NSString stringWithFormat:@"\r\n--%@--\r\n", _boundary];
    return [end dataUsingEncoding:NSUTF8StringEncoding];
}

#pragma mark - 生成POST需要的數據格式
- (NSData *)createPostData
{
    if (_boundary && _parameters)
    {
        NSMutableData *postData = [NSMutableData data];
        
        // 添加頭
        [postData appendData:[self createParametersData]];
        
        // 添加圖片
        [_pictures enumerateObjectsUsingBlock:^(id obj, NSUInteger idx, BOOL *stop) {
            if ([obj isKindOfClass:[NSData class]])
            {
                [postData appendData:obj];
            }
        }];
        
        // 添加尾
        [postData appendData:[self createEndData]];
        
        return postData;
    }
    else
    {
        return nil;
    }
}

#pragma mark - 創建PNG格式的圖片
NSData * createPNGPicture(NSString *formBoundary, UIImage *image,
                          NSString *name,         NSString *filename)
{
    NSString *start = [NSString stringWithFormat:@"--%@", formBoundary];
    
    // 添加分界線，換行
    NSMutableString *subBody = [[NSMutableString alloc] init];
    [subBody appendFormat:@"\r\n%@\r\n", start];
    [subBody appendFormat:@"Content-Disposition: form-data; name=\"%@\"; filename=\"%@\"\r\n",
     name, filename];
    
    // 聲明上傳文件的格式
    [subBody appendFormat:@"Content-Type: image/png\r\n\r\n"];
    
    // 圖片data
    NSData *imageData = UIImagePNGRepresentation(image);
    
    // 生成圖片data
    NSMutableData *tmpData = [NSMutableData data];
    [tmpData appendData:[subBody dataUsingEncoding:NSUTF8StringEncoding]];
    [tmpData appendData:imageData];
    
    return [NSData dataWithData:tmpData];
}

- (void)configRequest:(NSMutableURLRequest **)request
{
    // 獲取到了POST包體
    NSData *data = [self createPostData];
    
    // 配置請求
    NSMutableURLRequest *tmpRequest = *request;
    
    // 設置請求POST包體
    tmpRequest.HTTPBody    = data;
    tmpRequest.HTTPMethod  = @"POST";
    
    // 設置HTTPHeaderField
    [tmpRequest setValue:[NSString stringWithFormat:@"%lu", (unsigned long)[data length]]
      forHTTPHeaderField:@"Content-Length"];
    [tmpRequest setValue:[NSString stringWithFormat:@"multipart/form-data; boundary=%@", _boundary]
      forHTTPHeaderField:@"Content-Type"];
}

@end

使用情況:

上傳圖片的截圖:

說一下幾個注意的地方:

以下地方會對request進行一些修改,注意**,這個是指針的指針,你懂得:)

 

大體流程就是:

1. 根據參數創建POST頭部信息

2. 填充中間的圖片信息

3. 用標示符表示結束信息

4. 對HTTPHeaderField進行一些設置

 

要實現以上這些是需要你對網絡知識有着充分理解的:),也許你用慣了第三方開源代碼,但不理解原理,還是很難根據需求進行必要修改,這一點需要注意哦.