由於自己的程式碼問題失誤來思考一下前後端數據傳輸的事兒
前言
我對自己的後台（express）進行介面測試的時候發現取不到req.body請求體，後來百度了一下了解到因為我用的REST Client插件使用的post傳參是以request payload形式發送後台的而這種格式需要以數據流的模式來接受或者使用express.json()數據處理中間件，還有一個常用的數據處理中間件express.urlencoded 用來解析application/x-www-form-urlencoded格式數據，隨後增加中間件後問題還是沒有得到解決，遂再次百度無果，最後發現是自己設置請求時請求頭內容和數據體內容之間沒有隔開導致請求頭被當做數據一起發送了。
引發思考的問題1-前後台互動式傳送的數據格式和編碼類型
HTTP請求中Request Payload 和 From Data的區別
瀏覽器這兩種格式的選擇是依據Content Type的類型來決定的
- 當Content Type為application/x-www-form-urlencoded(鍵值&鍵值)時將會是Form Data
- 當Content Type為application/json或者multipart/form-data時則是Request Payload
Content Type各類型有什麼區別
| Content Type | 描述 |
|---|---|
| application/x-www-form-urlencoded | 常見，form表單默認提交方式，ajax也常以這種方式提交 |
| multipart/form-data | 不對字元編碼。在使用包含文件上傳控制項的表單時，必須使用該值 |
| application/json | 序列化的JSON字元串，支援複雜的結構化數據，適合RESTful風格介面 |
| text/plain | 空格轉換為 “+” 加號，但不對特殊字元編碼 |
| text/xml | xml可擴展標記語言，逐漸被JSON取代 |
引發思考的問題2-如何接受數據流模式以及數據處理中間件的使用
以express為例：
| 方式 | 處理 |
|---|---|
| Form Data | req.body |
| Request Payload | var str=””;req.on(“data”,function(chunk){str+=chunk}) |
使用數據處理中間件後Request Payload也可以通過req.body拿到數據
express 4.16.0之前 我們可以使用border-parser插件
app.use(borderParser.json())解析application/json格式
app.use(borderParser.urlencoded({extend:false}))解析application/x-www-form-urlencode格式
express 4.16.0之後 我們要將borderParser替換為express
const express = require('express')就是這個express
因為他們被內置了 蕪湖~~~~ 不用再裝插件了
PS 題外話
眾所眾知http請求一般分為簡單請求和非簡單請求，簡單請求就是單純發送一條請求
而非簡單請求則會提前發送一條預檢請求來向伺服器確定正式請求能否正確發送，而正式請求的進入隊列的timing是早於預檢請求的，而開始timing則是晚於預檢請求，所以順序應該是正式請求進入隊列->預檢請求進入隊列->預檢請求開始執行->正式請求開始執行
