一個 HTML 表單中的 enctype 有三種類型

• application/x-www-urlencoded
• multipart/form-data
• text-plain

默認情況下是 application/x-www-urlencoded，當表單使用 POST 請求時财松，數(shù)據(jù)會被以 x-www-urlencoded 方式編碼到 Body 中來傳送瘪贱，
而如果 GET 請求，則是附在 url 鏈接后面來發(fā)送辆毡。

GET 請求只支持 ASCII 字符集菜秦，因此，如果我們要發(fā)送更大字符集的內容舶掖，我們應使用 POST 請求球昨。

注意

"application/x-www-form-urlencoded" 編碼的格式是 ASCII，如果 form 中傳遞的是二進制等 Media Type 類型的數(shù)據(jù)眨攘，那么 application/x-www-form-urlencoded 會把其編碼轉換成 ASCII 類型主慰。對于 1 個 non-ASCII 字符，它需要用 3 個 ASCII字符來表示鲫售，如果要發(fā)送大量的二進制數(shù)據(jù)（non-ASCII）共螺，"application/x-www-form-urlencoded" 顯然是低效的。因此情竹，這種情況下藐不，應該使用 "multipart/form-data" 格式。

The content type "application/x-www-form-urlencoded" is inefficient for sending large quantities of binary data or text containing non-ASCII characters. The content type "multipart/form-data" should be used for submitting forms that contain files, non-ASCII data, and binary data.

application/x-www-urlencoded

我們在通過 HTTP 向服務器發(fā)送 POST 請求提交數(shù)據(jù)，都是通過 form 表單形式提交的佳吞，代碼如下：

<FORM method="post" action="http://w.sohu.com" >
    <INPUT type="text" name="txt1">
    <INPUT type="text" name="txt2">
 </FORM>

提交時會向服務器端發(fā)出這樣的數(shù)據(jù)（已經(jīng)去除部分不相關的頭信息）拱雏，數(shù)據(jù)如下：

POST / HTTP/1.1
Content-Type:application/x-www-form-urlencoded
Accept-Encoding: gzip, deflate
Host: w.sohu.com
Content-Length: 21
Connection: Keep-Alive
Cache-Control: no-cache
 
txt1=hello&txt2=world

對于普通的 HTML Form POST請求，它會在頭信息里使用 Content-Length 注明內容長度底扳。
請求頭信息每行一條铸抑，空行之后便是 Body，即“內容”（entity）衷模。內容的格式是在頭信息中的 Content-Type 指定的鹊汛，如上是 application/x-www-form-urlencoded，這意味著消息內容會經(jīng)過 URL 格式編碼阱冶，就像在 GET請 求時 URL 里的 QueryString 那樣刁憋。txt1=hello&txt2=world

multipart/form-data

multipart/form-data 定義在 rfc2388 中，最早的 HTTP POST 是不支持文件上傳的木蹬，給編程開發(fā)帶來很多問題至耻。但是在1995年，ietf 出臺了 rfc1867镊叁，也就是《RFC 1867 -Form-based File Upload in HTML》尘颓，用以支持文件上傳。所以 Content-Type 的類型擴充了multipart/form-data 用以支持向服務器發(fā)送二進制數(shù)據(jù)晦譬。因此疤苹，發(fā)送 POST 請求時候，表單 <form> 屬性 enctype 共有二個值可選敛腌，這個屬性管理的是表單的 MIME 編碼：

① application/x-www-form-urlencoded (默認值)
② multipart/form-data

注：form 表單中 enctype 的默認值是 enctype="application/x- www-form-urlencoded".

通過 form 表單提交文件操作如下：

<FORM method="POST" action="http://w.sohu.com/t2/upload.do" enctype="multipart/form-data">
    <INPUT type="text" name="city" value="Santa colo">
    <INPUT type="text" name="desc">
    <INPUT type="file" name="pic">
 </FORM>

瀏覽器將會發(fā)送以下數(shù)據(jù)：

POST /t2/upload.do HTTP/1.1
User-Agent: SOHUWapRebot
Accept-Language: zh-cn,zh;q=0.5
Accept-Charset: GBK,utf-8;q=0.7,*;q=0.7
Connection: keep-alive
Content-Length: 60408
Content-Type:multipart/form-data; boundary=ZnGpDtePMx0KrHh_G0X99Yef9r8JZsRJSXC
Host: w.sohu.com

--ZnGpDtePMx0KrHh_G0X99Yef9r8JZsRJSXC
Content-Disposition: form-data; name="city"

Santa colo
--ZnGpDtePMx0KrHh_G0X99Yef9r8JZsRJSXC
Content-Disposition: form-data;name="desc"
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
 
...
--ZnGpDtePMx0KrHh_G0X99Yef9r8JZsRJSXC
Content-Disposition: form-data;name="pic"; filename="photo.jpg"
Content-Type: application/octet-stream
Content-Transfer-Encoding: binary
 
... binary data of the jpg ...
--ZnGpDtePMx0KrHh_G0X99Yef9r8JZsRJSXC--

從上面的 multipart/form-data 格式發(fā)送的請求的樣式來看卧土，它包含了多個 Parts，每個 Part 都包含頭信息部分像樊，
Part 頭信息中必須包含一個 Content-Disposition 頭尤莺，其他的頭信息則為可選項， 比如 Content-Type 等生棍。

Content-Disposition 包含了 type 和 一個名字為 name 的 parameter缝裁，type 是 form-data，name 參數(shù)的值則為表單控件（也即 field）的名字足绅，如果是文件，那么還有一個 filename 參數(shù)韩脑，值就是文件名氢妈。

比如：

Content-Disposition: form-data; name="user"; filename="hello.txt"

上面的 "user" 就是表單中的控件的名字，后面的參數(shù) filename 則是點選的文件名段多。
對于可選的 Content-Type（如果沒有的話）首量，默認就是 text/plain。

注意：

如果文件內容是通過填充表單來獲得，那么上傳的時候加缘，Content-Type 會被自動設置（識別）成相應的格式鸭叙，如果沒法識別，那么就會被設置成 "application/octet-stream"
如果多個文件被填充成單個表單項拣宏，那么它們的請求格式則會是 multipart/mixed沈贝。

如果 Part 的內容跟默認的 encoding 方式不同，那么會有一個 "content-transfer-encoding" 頭信息來指定勋乾。

下面宋下，我們填充兩個文件到一個表單項中，行程的請求信息如下：

Content-Type: multipart/form-data; boundary=AaB03x

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

Larry
--AaB03x
Content-Disposition: form-data; name="files"
Content-Type: multipart/mixed; boundary=BbC04y

--BbC04y
Content-Disposition: file; filename="file1.txt"
Content-Type: text/plain

... contents of file1.txt ...
--BbC04y
Content-Disposition: file; filename="file2.gif"
Content-Type: image/gif
Content-Transfer-Encoding: binary

...contents of file2.gif...
--BbC04y--
--AaB03x--

Boundary 分隔符

每個部分使用 --boundary 分割開來辑莫，最后一行使用 --boundary-- 結尾学歧。

實驗

To see exactly what is happening, use nc -l and an user agent like a browser or cURL.

Save the form to an .html file:

<FORM action="http://localhost:8000" method="post" enctype="multipart/form-data">
    <p><INPUT type="text" name="text" value="text default">
    <p><INPUT type="file" name="file1">
    <p><INPUT type="file" name="file2">
    <p><BUTTON type="submit">Submit</BUTTON>
</FORM>

Create files to upload:

echo 'Content of a.txt.' > a.txt
echo '<!DOCTYPE html><title>Content of a.html.</title>' > a.html

Run:

nc -l localhost 8000

Open the HTML on your browser, select the files and click on submit and check the terminal.

nc prints the request received. Firefox sent:

POST / HTTP/1.1
Host: localhost:8000
User-Agent: Mozilla/5.0 (X11; Ubuntu; Linux i686; rv:29.0) Gecko/20100101 Firefox/29.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: en-US,en;q=0.5
Accept-Encoding: gzip, deflate
Cookie: __atuvc=34%7C7; permanent=0; _gitlab_session=226ad8a0be43681acf38c2fab9497240; __profilin=p%3Dt; request_method=GET
Connection: keep-alive
Content-Type: multipart/form-data; boundary=---------------------------9051914041544843365972754266
Content-Length: 554

-----------------------------9051914041544843365972754266
Content-Disposition: form-data; name="text"

text default
-----------------------------9051914041544843365972754266
Content-Disposition: form-data; name="file1"; filename="a.txt"
Content-Type: text/plain

Content of a.txt.

-----------------------------9051914041544843365972754266
Content-Disposition: form-data; name="file2"; filename="a.html"
Content-Type: text/html

<!DOCTYPE html><title>Content of a.html.</title>

-----------------------------9051914041544843365972754266--

Aternativelly, cURL should send the same POST request as your a browser form:

nc -l localhost 8000
curl -F "text=default" -F "file1=@a.html" -F "file1=@a.txt" localhost:8000

You can do multiple tests with:

while true; do printf '' | nc -l localhost 8000; done

參考：

https://www.w3.org/TR/html401/interact/forms.html#h-17.13.4
https://stackoverflow.com/questions/4526273/what-does-enctype-multipart-form-data-mean/28380690#28380690
https://tools.ietf.org/html/rfc2388
https://stackoverflow.com/questions/913626/what-should-a-multipart-http-request-with-multiple-files-look-like