预览 multipart/form-data 请求体与响应体

本篇小文将演示如何检查和预览 multipart/form-data 请求与响应。

1. 什么是 multipart/form-data？

如果你正在开发上传功能，很可能会使用 Content-Type 为 multipart/form-data 的 POST 请求。

multipart/form-data 是一种特殊的请求体格式，其中每个值都作为一个数据块发送。各个部分之间由预先定义的分隔符（即 boundary）隔开。每个部分的键名记录在其 Content-Disposition 头部中。

使用 multipart/form-data，你可以：

向服务器发送一个或多个文件。
发送键值对（Key-Value）

如何构造 multipart/form-data

Alamofire

Alamofire 内置了用于上传 multipart/form-data 的函数。以下代码演示了如何将图片及其文件名上传到 httpbin.org 服务器。

let fileName = "image.png"
let imageData = Data() // Data of UIImage
AF.upload(multipartFormData: { multipartFormData in
    multipartFormData.append(Data(fileName.utf8), withName: "fileName")
    multipartFormData.append(imageData, withName: "file")
}, to: "https://httpbin.org/post")
    .responseDecodable(of: HTTPBinResponse.self) { response in
        debugPrint(response)
    }

URLSession

使用 URLSession 上传 multipart/form-data 相当复杂。以下代码演示了如何使用 URLSession 将 multipart/form-data 发送到 httpbin.org。

let fileData: Data = // Data of UIImage
let fileName = "image.png"
let boundary = UUID().uuidString

// Initialize the request
var request = URLRequest(url: URL(string: "https://httpbin.org/post")!)
request.httpMethod = "POST"

// Set multipart/form-data as a Content-Type
// Set boundary
request.setValue("multipart/form-data; boundary=\(boundary)", forHTTPHeaderField: "Content-Type")

// Create a part
let data = NSMutableData()
data.appendString("--\(boundary)\r\n")
data.appendString("Content-Disposition: form-data; name=\"\(fieldName)\"; filename=\"\(fileName)\"\r\n")
data.appendString("Content-Type: \(mimeType)\r\n\r\n")
data.append(fileData)
data.appendString("\r\n")

// Set as a body
request.httpBody = httpBody as Data

// Make a request
URLSession.shared.dataTask(with: request) { data, response, error in
  // Complete
}.resume()

2. 如何用 Proxyman 预览？

好消息是，Proxyman 开箱即支持 multipart/form-data 预览，无需进行任何配置。

只要 Content-Type 为 multipart/form-data，Proxyman 就会显示预览标签页。

将 multipart/form-data 的每个部分导出为文件

你还可以将每个 multipart 部分的数据导出为文件，并保存到本地。

这样就能方便地预览 iOS 应用上传的内容，并及时发现可能存在的问题。

上传失败时需要检查的内容

首先确认 Content-Type 头部中的 boundary 与请求体中的分隔符一致。然后检查每个字段名、文件名以及各部分的内容类型。服务器可能会接受请求，却忽略名称错误的部分。上传内容通常包含个人文件或表单数据，因此只有在确认安全的情况下，才保存或分享导出的部分。

Proxyman 是一款高性能的 macOS 应用，可帮助开发者抓取 iOS 设备、iOS 模拟器和 Android 设备上的 HTTPS 流量。

前往 https://proxyman.com 获取。

Noah Tran

2021年6月24日