express4.x Request對象獲得參數方法小談
前言: 最近繼續編寫nodejs後端代碼,突然想起之前博客園中寫過一篇自己還算滿意的博文;本月博文沒完成之際,搬運分享下。( ^_^ )
--------------------------------------------------正文分割線----------------------------------------------------
最近看完慕課網 「node.js 建站攻略」後, 對mongodb 操作有了進一步認識, 為了進一步鞏固該資料庫知識, 於是使用學到的知識搭建一個最簡單的mongoDemo.
搭建完成後已放到Github分享, 詳情請戳 mongoDemo源碼 感興趣的小夥伴可以看看;回到主題, 完成該小項目後對nodejs後台開發有了一些小悟,本文就req最常用的參數獲取做個小結;
node.js後台開發基本都會碰到使用req.param()、req.params 、 req.query、 req.body獲取參數的情況, 那麼它們有哪些區別呢?以下詳細分析之:
1. req.param()
該方法獲得參數最為方便, 可以說是其他三個屬性的綜合體;但是 express 4.x api文檔已寫明該方法將會棄用!今後只能改用其他三個req屬性獲取參數。(Ps: 本人寫express4.x項目用req.param()時不會報錯,但啟動項目時會有警告提示)
該方法的使用如下:
// /user/tobi for /user/:name n(express路由傳參)nreq.param(name)n// => "tobi"n// ?name=tobi(瀏覽器地址欄傳參)nreq.param(name)n// => "tobi"nn// POST name=tobinreq.param(name)n// => "tobi"n
該方法可以獲取
1)express路由器傳遞的參數;
2)地址欄參數;
3)postt提交的參數,例如表單中input的值, ajax(非同步)提交的對象值等。
2.req.params
與req.param()方法相比 該屬性只能獲取 「express路由器傳遞的參數」, 值得一提的是: 與req.params配合還能在express路由器中使用正則表達式。
先看下簡單的req.params 使用:
// GET /user/tjnreq.params.namen// => "tj"n
完整代碼中是這樣的:
var express = require(express);nvar app = express();nn// 地址欄: localhost:3000/user/tj napp.get(/user/:name, function(req, res){n var param = req.params.namen res.send(hello world + param); // hello world tjn});n
然後看看路由器中神奇的正則使用法,在地址欄輸入:localhost:3000/file/javascripts/jquery.js
而路由中設置了 「/file/*」 時:
// GET /file/javascripts/jquery.jsnreq.params[0]n// => "javascripts/jquery.js"n
完整代碼:
var express = require(express);nvar app = express();nn// 地址欄:localhost:3000/file/javascripts/jquery.jsnapp.get(/file/*, function(req, res){n var param = req.params[0];n res.send(param); //javascripts/jquery.jsn});n
ps: 如果沒在路由器設置參數, 則 req.params 獲得的值為空對象 {}
3.req.query
該屬性用法最為簡單, 直接獲取地址欄傳遞的參數;示例代碼如下:
// GET /search?q=tobi+ferretnreq.query.qn// => "tobi ferret"nn// GET /shoes?order=desc&shoe[color]=blue&shoe[type]=conversenreq.query.ordern// => "desc"nnreq.query.shoe.colorn// => "blue"nnreq.query.shoe.typen// => "converse"n
完整代碼:
var express = require(express);nvar app = express();nn// 地址欄: localhost:3000/search?q=tobi+ferretnapp.get(/search, function(req, res){n var param = req.query.q;n res.send(param); //tobi ferretn});nn// 地址欄: localhost:3000/shoes?order=desc&shoe[color]=blue&shoe[type]=conversenapp.get(/shoes, function(req, res){n var _order = req.query.order;n var _color = req.query.shoe.color;n var _type = req.query.shoe.type;n console.log(_order); // descn console.log(_color); // bluen console.log(_type); // conversen res.send(hello world); n});n
ps: 如果地址欄沒傳遞參數, req.query獲得的值也是空對象{}
4. req.body
該屬性主要用與post方法時傳遞參數使用, 用法最為廣泛也最為常見, 例子也比較多(寫這部分最累了有木有)。需要說明下的是使用該屬性時, 得先確認app.js中有沒有導入「body-parser」, 該模塊在express4.x中已經脫離為獨立的模塊。
示例代碼如下:
var app = require(express)();nvar bodyParser = require(body-parser);nvar multer = require(multer); nnapp.use(bodyParser.json()); // for parsing application/jsonnapp.use(bodyParser.urlencoded({ extended: true })); // for parsing application/x-www-form-urlencodednapp.use(multer()); // for parsing multipart/form-datannapp.post(/, function (req, res) {n console.log(req.body);n res.json(req.body);n})n
最常使用req.body的場合有:
4-1 表單post傳遞參數至後台:
網站中經常用表單傳遞參數給後台, 在express4.x中使用req.body接收參數, 完整代碼如下:
<form method="POST" action="add" name="userform" >n <input type="text" id="name" name="name" value="xq" class="form-control" />n <input type="text" id="age" name="age" value="12" class="form-control" />n <input type="text" id="job" name="job" value="coder" class="form-control" />n <input type="text" id="hobby" name="hobby" value="run" class="form-control" />n <button type="submit" class="btn btn-primary">提交添加</button>n </form>n
var express = require(express);nvar router = express.Router();nnrouter.route(/add).post(function(req, res){n var userObj = {};n userObj = {n name: req.body.name,n age: req.body.age,n job: req.body.job,n hobby: req.body.hobbyn };n console.log(userObj); // {name:xq,age:12,job:coder,hobby:run}n});n
4-2 jquery ajax傳遞參數至後台:
網站開發當然少不了使用非同步傳遞參數給後台, express4.x中也是以req.body接收非同步傳遞的參數, 完整代碼如下:
var _id = 123456;n$.post(/user/delete, {id: _id}, function(data){n if (data.error){n $(#removeTips).html(刪除異常: + data.error + 請刷新重試。);n }else{n window.location.href = /admin/;n }n }, json);n
var express = require(express);nvar router = express.Router();nrouter.route(/user/delete).post(function(req, res){n var _id = req.body.id;n console.log(_id); // 123456n res.json({result: success});n});n
ps: 如果post給後台沒有傳遞任何參數時, req.body的值當然也是空對象{}
參考文檔:express API
推薦閱讀:
※4.2 目錄結構-博客後端Api-NodeJs+Express+Mysql實戰
※Node.js中request+response數據結構分解
※Node.js 性能調優之CPU篇(二)——v8-profiler
※酷站推薦 - mermaidjs.github.io - diagrams and flowcharts from markdown text
※Node.js v8.x 新特性 Async Hook 簡介
