bodyParser中間件的研究

Richard_Gao 發布于2019-08-19 17:34 / 2343人閱讀

摘要：中間件的研究接觸已有一段時間了，但最近才開始落實項目，于是使用應用生成器生成了一個應用。中間件中間件用來解析請求體，是默認使用的中間件之一。就是內建的對象之一，用來字符串化對象或解析字符串。

bodyParser中間件的研究

接觸nodejs已有一段時間了，但最近才開始落實項目，于是使用express應用生成器生成了一個應用。開發過程中發現ajax提交的數據無法被express正確的解析，主要的情況是這樣的：

// 瀏覽器端post一個對象
$.ajax({
    url: "/save",
    type: "post",
    data: {
        name: "henry",
        age: 30,
        hobby: [ "sport", "coding" ]
    }
});

// express接收這個對象
router.post("/save", function (req, res, next) {
    console.log(req.body); // => { "info[name]": "henry","info[age]": "30","hobby[1]": "sport","hobby[2]": "coding" }
});

顯然這樣的解析結果是不能直接拿來用的，莫名其妙的一個坑，困了我許久。

bodyParser中間件

bodyParser中間件用來解析http請求體，是express默認使用的中間件之一。

使用express應用生成器生成一個網站，它默認已經使用了 bodyParser.json 與 bodyParser.urlencoded 的解析功能，除了這兩個，bodyParser還支持對text、raw的解析。

app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));

顧名思義，bodyParser.json是用來解析json數據格式的。bodyParser.urlencoded則是用來解析我們通常的form表單提交的數據，也就是請求頭中包含這樣的信息： Content-Type: application/x-www-form-urlencoded

常見的四種Content-Type類型：

application/x-www-form-urlencoded 常見的form提交

multipart/form-data 文件提交

application/json 提交json格式的數據

text/xml 提交xml格式的數據

詳細解讀 urlencoded

bodyParser.urlencoded 模塊用于解析req.body的數據，解析成功后覆蓋原來的req.body，如果解析失敗則為 {}。該模塊有一個屬性extended，官方介紹如下：

The extended option allows to choose between parsing the URL-encoded data with the querystring library (when false) or the qs library (when true). Defaults to true, but using the default has been deprecated.

大致的意思就是：extended選項允許配置使用querystring(false)或qs(true)來解析數據，默認值是true，但這已經是不被贊成的了。

querystring就是nodejs內建的對象之一，用來字符串化對象或解析字符串。如

querystring.parse("name=henry&age=30") => { name: "henry", age: "30" }

那么，既然querystring已經能完成對urlencode的解析了，為什么還需要qs？qs又是什么？

qs介紹

qs是一個querystring的庫，在qs的功能基礎上，還支持更多的功能并優化了一些安全性。比如，對象解析的支持：

// 內建對象 querystring
querystring.parse("info[name]=henry&info[age]=30&hobby[1]=sport&hobby[2]=coding") => 
  { 
    "info[name]": "henry",
    "info[age]": "30",
    "hobby[1]": "sport",
    "hobby[2]": "coding"
  }

// 第三方插件 qs
qs.parse("info[name]=henry&info[age]=30&hobby[1]=sport&hobby[2]=coding") => 
  {
    info: {
      name: "henry",
      age: "30"
    },
    hobby: [ "sport", "coding" ]
  }

可以看出，querystring并不能正確的解析復雜對象（多級嵌套），而qs卻可以做到。

但是qs也不是萬能的，對于多級嵌套的對象，qs只會解析5層嵌套，超出的部分會表現的跟本文頭部的那種情況一樣；對于數組，qs最大只會解析20個索引，超出的部分將會以鍵值對的形式解析。

作為一個中間件，qs必須要為性能考慮，才會有如此多的限制，express也默認使用qs來解析請求體。

理論上來說，form表單提交不會有多級嵌套的情況，而urlencoded本身也是form的內容類型，因此，bodyParser.urlencoded不支持多級嵌套也是很合理的設計。

那么，如果我們非要上傳一個十分復雜的對象，應該怎么辦？

解決方案

出現這個問題的根本原因是：我以form的形式去提交了一個json數據。

jquery默認的 content-Type 配置的是 application/x-www-form-urlencoded，

因此更改ajax請求參數：contentType: "application/json"，并將數據轉成json提交，問題就解決了。

// 瀏覽器端post一個對象
$.ajax({
    url: "/save",
    type: "post",
    contentType: "application/json",
    data: JSON.stringify({
        name: "henry",
        age: 30,
        hobby: [ "sport", "coding" ]
    })
});

// express接收這個對象
router.post("/save", function (req, res, next) {
    console.log(req.body); // => { name: "henry", age: 30, hobby: [ "sport", "coding" ] }
});

參考資料

body-parser

大多時候，我們只知道如何去使用，而不知道為什么這么用。

GPU云服務器云服務器 bodyParser 物聯網的研究金融云服務的研究云計算的研究意義

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/78643.html

vue+express+mongoose項目構建

摘要：注僅做記錄使用又不舍得刪除推薦使用相關資料很多的運行環境構建基于全局安裝安裝過程略配置的淘寶鏡象全局安裝官方腳手架工具官網文檔創建項目基于模板創建創建配置按需，我除了安裝之外其他都選了運行與打包測試安裝依賴包運行打包配注(2018-2-12):僅做記錄使用,又不舍得刪除,推薦使用koa2,koa2相關資料很多的~ 1. 運行環境構建（基于macOS Sierra 10.12.4） ...

SKYZACK 2019-08-20 15:39 評論0 收藏0
express簡單總結

摘要：介紹如有不詳細或者不正確的地方多多指正。可以通過官方提供的命令行進行安裝，官方目前默認的界面文件用格式，建議修改為格式的文件版權問題，同時要在中安裝對應的包和設置對應的界面引擎解釋器。 express介紹如有不詳細或者不正確的地方多多指正。我們可以拿js與jquery關系來類比一下： jQuery是JS在瀏覽器環境下的封裝庫，把DOM操作，ajax等封裝成了兼容性好，方便使用的方法...

ivyzhang 2019-08-22 13:52 評論0 收藏0
express 框架中的參數小記

摘要：查詢字符串中的參數要用比如這樣的請求，應該是要用和來獲取和的值，最終打印出如下關于此外，框架本身是沒有解析的如果打印出來則說明沒有安裝解析的插件為了解析一般可以安裝這個插件假設是的實例在所有路由前插入這個中間件這樣就可以了。首發地址：https://clarencep.com/2017/04...轉載請注明出處注意：req.params 只有在參數化的路徑中的參數。查詢字符串中的參...

Pandaaa 2019-08-20 15:32 評論0 收藏0
從零搭建Koa2 Server

摘要：于是翻遍與各大網站，都沒找到一個好用的輕一點的腳手架，也找不到一個清晰些的搭建介紹。現在把搭建過程介紹下，看能不能方便下入門的同學。創建一個文件夾，命名。記得先裝好以上版本一路回車，根據提示輸入信息。但這只是初步的搭建了下。前幾天想寫個小爬蟲程序，準備后端就用koa2。于是翻遍github與各大網站，都沒找到一個好用的、輕一點的koa2腳手架，也找不到一個清晰些的搭建介紹。githu...

JellyBool 2019-08-21 15:49 評論0 收藏0