社群 學習 工具庫 休閒
搜尋
繁体中文
首頁 > web前端 > js教程 > Nodejs中常用中間件body-parser的實例詳解

Nodejs中常用中間件body-parser的實例詳解

Y2J
發布： 2017-05-23 13:25:52
原創
3087 人瀏覽過

這篇文章主要介紹了Nodejs中Express 常用中間件body-parser 實作解析，具有一定的參考價值，有興趣的小夥伴可以參考一下

##寫在前面

body-parser是非常常用的一個express中間件，作用是對post請求的請求體進行解析。使用非常簡單，以下兩行程式碼已經涵蓋了大部分的使用場景。 

app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
登入後複製

本文從簡單的例子出發，探究

body-parser的內部實作。至於body-parser如何使用，有興趣的同學可以參考官方文件。

入門基礎

在正式講解前，我們先來看一個POST請求的報文，如下所示。 

POST /test HTTP/1.1
Host: 127.0.0.1:3000
Content-Type: text/plain; charset=utf8
Content-Encoding: gzip

chyingp
登入後複製

其中需要我們注意的有

Content-Type、Content-Encoding以及封包主體：

  1. Content -Type：請求封包主體的類型、編碼。常見的類型有text/plain、application/json、application/x-www-

    form-urlencoded。常見的編碼有utf8、gbk等。

  2. Content-Encoding：宣告封包主體的壓縮格式，常見的取值有gzip、deflate、identity。

  3. 封包主體：這裡是個普通的文字

    字串chyingp。

body-parser主要做了什麼

#body-parser實作的重點如下：

1.處理不同類型的請求體：例如text、json、urlencoded等，對應的封包主體的格式不同。


2.處理不同的編碼：例如utf8、gbk等。


3.處理不同的壓縮類型：例如gzip、deflare等。


4.其他邊界、異常的處理。

一、處理不同類型請求體

為了方便讀者測試，以下範例都包含服務端、客戶端程式碼，完整程式碼可在筆者github上找到。

解析text/plain

客戶端請求的程式碼如下，採用預設編碼，不對請求體進行壓縮。請求體類型為

text/plain。 

var http = require('http');

var options = {
  hostname: '127.0.0.1',
  port: '3000',
  path: '/test',
  method: 'POST',
  headers: {
    'Content-Type': 'text/plain',
    'Content-Encoding': 'identity'
  }
};

var client = http.request(options, (res) => {
  res.pipe(process.stdout);
});

client.end('chyingp');
登入後複製

服務端程式碼如下。

text/plain類型處理比較簡單，就是buffer的拼接。 

var http = require('http');

var parsePostBody = function (req, done) {
  var arr = [];
  var chunks;

  req.on('data', buff => {
    arr.push(buff);
  });

  req.on('end', () => {
    chunks = Buffer.concat(arr);
    done(chunks);
  });
};

var server = http.createServer(function (req, res) {
  parsePostBody(req, (chunks) => {
    var body = chunks.toString();
    res.end(`Your nick is ${body}`)
  });
});

server.listen(3000);
登入後複製

解析application/json

客戶程式碼如下，把

Content-Type換成application/json。 

var http = require('http');
var querystring = require('querystring');

var options = {
  hostname: '127.0.0.1',
  port: '3000',
  path: '/test',
  method: 'POST',
  headers: {
    'Content-Type': 'application/json',
    'Content-Encoding': 'identity'
  }
};

var jsonBody = {
  nick: 'chyingp'
};

var client = http.request(options, (res) => {
  res.pipe(process.stdout);
});

client.end( JSON.stringify(jsonBody) );
登入後複製

服務端程式碼如下，相較於

text/plain，只是多了個JSON.parse()的過程。 

var http = require('http');

var parsePostBody = function (req, done) {
  var length = req.headers['content-length'] - 0;
  var arr = [];
  var chunks;

  req.on('data', buff => {
    arr.push(buff);
  });

  req.on('end', () => {
    chunks = Buffer.concat(arr);
    done(chunks);
  });
};

var server = http.createServer(function (req, res) {
  parsePostBody(req, (chunks) => {
    var json = JSON.parse( chunks.toString() );  // 关键代码  
    res.end(`Your nick is ${json.nick}`)
  });
});

server.listen(3000);
登入後複製

解析application/x-www-form-urlencoded

客戶端程式碼如下，這裡透過

querystring對請求體進行格式化，得到類似nick=chyingp的字串。 

var http = require('http');
var querystring = require('querystring');

var options = {
  hostname: '127.0.0.1',
  port: '3000',
  path: '/test',
  method: 'POST',
  headers: {
    'Content-Type': 'form/x-www-form-urlencoded',
    'Content-Encoding': 'identity'
  }
};

var postBody = { nick: 'chyingp' };

var client = http.request(options, (res) => {
  res.pipe(process.stdout);
});

client.end( querystring.stringify(postBody) );
登入後複製

服務端程式碼如下，同樣跟

text/plain的解析差不多，就多了個querystring.parse()的呼叫。 

var http = require('http');
var querystring = require('querystring');

var parsePostBody = function (req, done) {
  var length = req.headers['content-length'] - 0;
  var arr = [];
  var chunks;

  req.on('data', buff => {
    arr.push(buff);
  });

  req.on('end', () => {
    chunks = Buffer.concat(arr);
    done(chunks);
  });
};

var server = http.createServer(function (req, res) {
  parsePostBody(req, (chunks) => {
    var body = querystring.parse( chunks.toString() ); // 关键代码
    res.end(`Your nick is ${body.nick}`)
  });
});

server.listen(3000);
登入後複製

二、處理不同編碼

很多時候，來自客戶端的請求，採用的不一定是預設的

utf8編碼，這個時候，就需要對請求體進行解碼處理。

客戶端請求如下，有兩個要點。


1.編碼聲明：在Content-Type最後加上;charset=gbk


#2.請求體編碼：這裡藉助了iconv-lite，對請求體進行編碼iconv.encode('程式猿小卡', encoding)

var http = require('http');
var iconv = require('iconv-lite');

var encoding = 'gbk'; // 请求编码

var options = {
  hostname: '127.0.0.1',
  port: '3000',
  path: '/test',
  method: 'POST',
  headers: {
    'Content-Type': 'text/plain; charset=' + encoding,
    'Content-Encoding': 'identity',    
  }
};

// 备注：nodejs本身不支持gbk编码，所以请求发送前，需要先进行编码
var buff = iconv.encode('程序猿小卡', encoding);

var client = http.request(options, (res) => {
  res.pipe(process.stdout);
});

client.end(buff, encoding);
登入後複製

服務端程式碼如下，這裡多了兩個步驟：編碼判斷、解碼操作。首先透過

Content-Type取得編碼類型gbk，然後透過iconv-lite進行反向解碼操作。 

var http = require('http');
var contentType = require('content-type');
var iconv = require('iconv-lite');

var parsePostBody = function (req, done) {
  var obj = contentType.parse(req.headers['content-type']);
  var charset = obj.parameters.charset; // 编码判断：这里获取到的值是 'gbk'

  var arr = [];
  var chunks;

  req.on('data', buff => {
    arr.push(buff);
  });

  req.on('end', () => {
    chunks = Buffer.concat(arr);
    var body = iconv.decode(chunks, charset); // 解码操作
    done(body);
  });
};

var server = http.createServer(function (req, res) {
  parsePostBody(req, (body) => {
    res.end(`Your nick is ${body}`)
  });
});

server.listen(3000);
登入後複製

三、處理不同壓縮型別

這裡舉個

gzip壓縮的例子。客戶端程式碼如下，重點如下：

1.壓縮類型宣告：Content-Encoding賦值為gzip。


2.請求體壓縮：透過zlib模組對請求體進行gzip壓縮。 

var http = require('http');
var zlib = require('zlib');

var options = {
  hostname: '127.0.0.1',
  port: '3000',
  path: '/test',
  method: 'POST',
  headers: {
    'Content-Type': 'text/plain',
    'Content-Encoding': 'gzip'
  }
};

var client = http.request(options, (res) => {
  res.pipe(process.stdout);
});

// 注意：将 Content-Encoding 设置为 gzip 的同时，发送给服务端的数据也应该先进行gzip
var buff = zlib.gzipSync('chyingp');

client.end(buff);
登入後複製

服務端程式碼如下，這裡透過

zlib模組，對請求體進行了解壓縮操作（guzip）。 

var http = require('http');
var zlib = require('zlib');

var parsePostBody = function (req, done) {
  var length = req.headers['content-length'] - 0;
  var contentEncoding = req.headers['content-encoding'];
  var stream = req;

  // 关键代码如下
  if(contentEncoding === 'gzip') {
    stream = zlib.createGunzip();
    req.pipe(stream);
  }

  var arr = [];
  var chunks;

  stream.on('data', buff => {
    arr.push(buff);
  });

  stream.on('end', () => {
    chunks = Buffer.concat(arr);    
    done(chunks);
  });

  stream.on('error', error => console.error(error.message));
};

var server = http.createServer(function (req, res) {
  parsePostBody(req, (chunks) => {
    var body = chunks.toString();
    res.end(`Your nick is ${body}`)
  });
});

server.listen(3000);
登入後複製

寫在後面

body-parser的核心實作並不複雜，翻看原始碼後你會發現，更多的程式碼是在處理異常跟邊界。

另外，對於POST請求，還有一個非常常見的

Content-Type是multipart/form-data，這個的處理相對複雜些， body-parser不打算對其進行支援。篇幅有限，後續章節再繼續展開。

【相關推薦】

1. 

Javacript免費影片教學

2.

 JS實作marquee捲動效果的實例詳解

3. 

JS製作QQ聊天訊息展示和評論提交功能的程式碼範例

4. 單行 JS 實作行動裝置金錢格式檢定

#5. JavaScript表單驗證實作程式碼_javascript技巧

以上是Nodejs中常用中間件body-parser的實例詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章！

相關標籤：
body express nodejs parser
來源：php.cn
上一篇：JavaScript表單驗證實作程式碼_javascript技巧 下一篇：JS實作多層功能表列的程式碼範例
本網站聲明
本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn
作者最新文章
最新問題
Docker中使用NodeJS連接MySQL時出現錯誤 我創建了一個連接到MySQL的NodeJS後端伺服器。透過使用Docker，我使用以下命令建立了一個映像來運行我的nodeJS和package.json檔案（其中包括MySQL）。...
來自於 2024-04-06 12:07:19
0
1
415
React/Node：使用 Trial_period_days 進行訂閱時遇到整合錯誤 我在Stripe中定義了一個產品，我希望將其設置為7天免費試用，然後向客戶收費（除非他們事先取消）通過Firebase使用自定義Nodejs函數-我收到以下錯誤：Missingva...
來自於 2024-04-04 20:30:57
0
1
320
next 在使用 Nodejs 的中間件中無法正常運作 我正在使用Nodejs並使用expressjs，現在我正在研究中間件功能，我想知道中間件概念中的「下一個」工作是什麼？ “下一個進入下一個中間件”，但是什麼是“下一個中間件”？我嘗...
來自於 2024-04-04 17:33:56
0
1
340
一個簡單的Hello world程式建立多個節點實例 我對Javascript和NodeJS非常陌生。我正在運行一個簡單的helloworld程序，如下方案1constdurationInSeconds=10;console.log(...
來自於 2024-04-04 11:03:22
0
1
310
SQL 查詢未顯示在 Node.js 的特定路由中 我是javascript和nodejs新手，我有一個問題我有一個程式碼，我正在一個簡單的API中工作，但我很難理解為什麼會發生這種情況app.get('/api/list_all'...
來自於 2024-04-04 00:24:22
0
1
344
相關專題
更多>
熱門推薦
熱門教學
更多>
相關教學
熱門推薦
最新課程
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板