理解HTTP之 content-type

Escape Plan發表於2019-04-09

基本介紹與句法

content-typeHTTP 的首部欄位,用於指示資源的 MIME 型別,說明請求或返回的訊息主體是用何種方式編碼。

在響應中,Content-Type 標頭告訴客戶端實際返回的內容的內容型別。

在請求中, (如 POSTPUT),客戶端告訴伺服器實際傳送的資料型別。

句法

Content-Type: text/html; charset=utf-8
Content-Type: multipart/form-data; boundary=something
複製程式碼

上面列的兩個Content-Type是通用的句法結構:

  • text/html,是指請求的 MIME(media-type),他分為兩個部分 typesubtype,以“/”進行分割;subtypetype 的詳細資訊。例如 text/plaintext 指文字,plaintext 進一步限制,指純文字。 常見的 type 有:

    • Text:用於標準化地表示的文字資訊,文字訊息可以是多種字符集和或者多種格式的;
    • Multipart:用於連線訊息體的多個部分構成一個訊息,這些部分可以是不同型別的資料;
    • Application:用於傳輸應用程式資料或者二進位制資料;
    • Message:用於包裝一個E-mail訊息;
    • Image:用於傳輸靜態圖片資料;
    • Audio:用於傳輸音訊或者音聲資料;
    • Video:用於傳輸動態影像資料,可以是與音訊編輯在一起的視訊資料格式。
  • charset:是指定字元編碼的標準,常見的有"ISO-8859-1"、"UTF-8"、"GB2312“,”ASCII“等;

  • boundary:多用於上傳檔案時使用,用於分割資料;

MIME type (現在稱為“媒體型別(media type)”,但有時也是“內容型別(content type)”)是指示檔案型別的字串,與檔案一起傳送(例如,一個聲音檔案可能被標記為 audio/ogg,一個影像檔案可能是 image/png)。 它與傳統Windows上的副檔名有相同目的。

常用型別

常見的 media-type 有:

  • text/html
  • text/plain
  • text/css
  • text/javascript
  • application/xml
  • application/x-www-form-urlencoded
  • application/json
  • multipart/form-data

前面的幾種都比較簡單,下面主要介紹一下後面幾種型別。

application/x-www-form-urlencoded

這是最常見的 POST 提交資料的方式了。瀏覽器的原生 <form> 表單,如果不設定 enctype 屬性,那麼最終就會以 application/x-www-form-urlencoded 方式提交資料。

比如下面一個簡單的表單:

<form action="http://homeway.me/post.php" method="POST">
    <input type="text" name="name" value="homeway">
    <input type="text" name="key" value="nokey">
    <input type="submit" value="submit">
</form>
複製程式碼

首先,Content-Type 被指定為 application/x-www-form-urlencoded;其次,提交的資料按照 key1=val1&key2=val2 的方式進行編碼,key 和 val 都會進行 URL 轉碼。

multipart/form-data

常見的 POST 資料提交的方式。我們使用表單上傳檔案時(type=file),必須讓 form 的 enctype 等於這個值。如果上傳照片,檔案等,由於很多情況下都會有批量上傳,為了區分不同的資料,multipart/form-data的型別有boundary引數進行分割,

<form action="/" method="post" enctype="multipart/form-data">
  <input type="file" name="file1" value="some text">
  <input type="file" name="file2">
  <button type="submit">Submit</button>
</form>
複製程式碼
------WebKitFormBoundary18bktajg65CSIx4j
Content-Disposition: form-data; name="files"; filename="test1.txt"
Content-Type: text/plain

this is file1;
------WebKitFormBoundary18bktajg65CSIx4j
Content-Disposition: form-data; name="files"; filename="test2.txt"
Content-Type: text/plain

this is file2;
------WebKitFormBoundary18bktajg65CSIx4j--
複製程式碼

上面請求是上傳了兩個檔案,分別是 test1.txt 和test2.txt,檔案內容分別是“this is file1;” 和 “this is file2;” 可以看到兩個檔案由於是文字,Content-Type 為 text/plainContent-Disposition 中包含 namefilename 屬性,name 是 form 表單提交內容裡的 name 屬性,檔案之間有 ------WebKitFormBoundary18bktajg65CSIx4j 這樣一串字元隔開,這串字元就是 boundary 分割符,字串隨機生成不會與文字內容重複。

application/json

application/json 是 POST 請求以 JSON 的格式向服務請求發起請求或者請求返回 JSON 格式的響應內容,服務端接收到資料後對 JSON 進行解析拿到所需要的引數。這也是現在用的比較多的一種形式。

POST [http://www.example.com](http://www.example.com) HTTP/1.1 
Content-Type: application/json;charset=utf-8 

// body 
{"title":"test","sub":[1,2,3]}
複製程式碼

相關文章