Express是一個(gè)基于Node.js平臺(tái)的web應(yīng)用開(kāi)發(fā)框架，在Node.js基礎(chǔ)之上擴(kuò)展了web應(yīng)用開(kāi)發(fā)所需要的基礎(chǔ)功能，從而使得我們開(kāi)發(fā)Web應(yīng)用更加方便、更加快捷。

舉一個(gè)例子：

用node.js實(shí)現(xiàn)一個(gè)控制臺(tái)打印“hello server”

var http = require('http');
var server = http.createServer(function(req,res){
 console.log("hello server");
});
server.listen(3000);

這樣子的話，當(dāng)我們需要處理各種請(qǐng)求（主要指GET、POST）時(shí)，我們需要將所有請(qǐng)求類型處理的代碼寫在createServer包裹的函數(shù)里。

用Express實(shí)現(xiàn)一個(gè)控制臺(tái)打印“hello server”

var express = require('express');
var app = express();
http.createServer(app);
 
// 處理用戶請(qǐng)求（路由）
app.get("/",function(){
 console.log("hello server");
})

Express處理各種請(qǐng)求是通過(guò)Express執(zhí)行函數(shù)去調(diào)用對(duì)應(yīng)的方法，這樣是不是更加方便和快捷了。

Express的API文檔完整易懂，2010-01-03陸續(xù)發(fā)布了幾個(gè)版本，其中第三版和第四版差異比較大， 主要體現(xiàn)在第三版的中間件基本上都是繼承了connect框架的，而第四版將中間件獨(dú)立出來(lái)了，不在依賴connect框架。

說(shuō)到中間件，官網(wǎng)對(duì)它的闡述是這樣的：

“Express是一個(gè)自身功能極簡(jiǎn)，完全是路由和中間件構(gòu)成一個(gè)web開(kāi)發(fā)框架：從本質(zhì)上來(lái)說(shuō)，一個(gè)Express應(yīng)用就是在調(diào)用各種中間件?！?/p>

由此可見(jiàn)，中間件在Express開(kāi)發(fā)中的重要性，因此這里我們就專門來(lái)總結(jié)一下中間件。

一、中間件結(jié)構(gòu)

1、app.use（[path]，function）

path：是路由的url，默認(rèn)參數(shù)‘/'，意義是路由到這個(gè)路徑時(shí)使用這個(gè)中間件

function：中間件函數(shù)

這個(gè)中間件函數(shù)可以理解為就是function(request,response,next)

這里安裝是指涉及到第三方中間件的使用時(shí)，需要先安裝好，然后在使用。

二、中間件分類

1、內(nèi)置中間件

 express.static 是Express目前唯一內(nèi)置的一個(gè)中間件。用來(lái)處理靜態(tài)資源文件。

什么意思了？ 來(lái)run一下代碼看看

// index.js
var express = require('express');
var app = express();
 
app.use(express.static(__dirname + '/public'));

啟動(dòng)服務(wù)： node index.js

瀏覽器中訪問(wèn)： http://localhost:1234/ 展示的/public/index.html內(nèi)容

瀏覽器中訪問(wèn)： http://localhost:1234/hello.html 展示的/public/hello.html內(nèi)容

2、自定義中間件

在上面中間件結(jié)構(gòu)中，我們知道了，中間件使用時(shí)的第二個(gè)參數(shù)是一個(gè)Function，然而，要自定義一個(gè)中間件，就是倒騰一番這個(gè)Function。

這個(gè)function總共有三個(gè)參數(shù)（req，res，next）；

當(dāng)每個(gè)請(qǐng)求到達(dá)服務(wù)器時(shí)，nodejs會(huì)為請(qǐng)求創(chuàng)建一個(gè)請(qǐng)求對(duì)象（request），該請(qǐng)求對(duì)象包含客戶端提交上來(lái)的數(shù)據(jù)。同時(shí)也會(huì)創(chuàng)建一個(gè)響應(yīng)對(duì)象（response），響應(yīng)對(duì)象主要負(fù)責(zé)將服務(wù)器的數(shù)據(jù)響應(yīng)到客戶端。而最后一個(gè)參數(shù)next是一個(gè)方法，因?yàn)橐粋€(gè)應(yīng)用中可以使用多個(gè)中間件，而要想運(yùn)行下一個(gè)中間件，那么上一個(gè)中間件必須運(yùn)行next()。

好了，有了一個(gè)大概的了解，下面我定義一些中間件來(lái)實(shí)現(xiàn)一個(gè)路由功能。

var express = require('express');
var app = express();
 
app.use(function(request,response,next){
 if(request.url === '/'){
  response.writeHead(200,{"Content-Type":"text/plain"});
  response.end("This is home\n");
 } else {
  next();
 }
})
app.use(function(request,response,next){
 if(request.url === '/about'){
  response.writeHead(200,{"Content-Type":"text/plain"});
  response.end("This is about\n");
 } else {
  next();
 }
})
app.use(function(request,response,next){
 response.writeHead(404,{"Content-Type":"text/plain"});
 response.end("404 not found!\n");
})
app.listen(1234,'localhost');

瀏覽器中訪問(wèn)： http://localhost:1234/ 展示This is home

瀏覽器中訪問(wèn)： http://localhost:1234/about 展示This is about

這樣看是不是使用中間件很輕松就實(shí)現(xiàn)了路由的功能，當(dāng)然，有關(guān)Express的路由可以專門拿出來(lái)寫寫，哈哈。

3、第三方中間件

有關(guān)第三方中間件，這里我們分析幾個(gè)比較重要和常用的，知道這幾個(gè)的使用，其它的也就會(huì)了。

body-parser ：解析body中的數(shù)據(jù)，并將其保存為Request對(duì)象的body屬性。

cookie-parser ：解析客戶端cookie中的數(shù)據(jù)，并將其保存為Request對(duì)象的cookie屬性

express-session ：解析服務(wù)端生成的sessionid對(duì)應(yīng)的session數(shù)據(jù)，并將其保存為Request對(duì)象的session屬性

query：這個(gè)中間件將一個(gè)查詢字符串從URL轉(zhuǎn)換為JS對(duì)象，并將其保存為Request對(duì)象的query屬性。這個(gè)中間件在第四個(gè)版本中已經(jīng)內(nèi)置了無(wú)需安裝。

下面來(lái)一個(gè)例子，功能是：用戶可否登錄和在服務(wù)端保存登錄態(tài)。

var express = require('express');
// 引入模板引擎
var hbs = require('express-handlebars');
var bodyParser = require('body-parser');
var session = require('express-session');
 
var app = express();
 
// hbs是一個(gè)模板引擎
app.engine('hbs',hbs());
app.set('view engine','hbs');
app.set('views','templates');
 
// 數(shù)據(jù)庫(kù)讀出來(lái)的數(shù)據(jù)
var userArr = ['wpzheng'];
 
app.use(session({secret:'maizidu'}));
app.use(bodyParser.urlencoded({extended:true}));
 
app.get('/', function(request,response,next){
 var username = request.session.username;
 if(username){
  response.send("hello" + username);
 }else{
  response.render('form');
 }
});
 
app.post('/', function(request,response){
  if(userArr.indexOf(request.body.username)>=0){
   request.session.username = request.body.username;
  }else{
   request.session.destroy();
  }
    // response對(duì)象的一個(gè)方法 重定向作用
  response.redirect('/');
});
app.listen(1234,'localhost');

如果session沒(méi)有保存數(shù)據(jù)（測(cè)試時(shí)可以將服務(wù)關(guān)閉，session就沒(méi)有值了，每次向服務(wù)器發(fā)送請(qǐng)求時(shí)，服務(wù)會(huì)創(chuàng)建一個(gè)新的session），就會(huì)自動(dòng)跳到登錄頁(yè)面。當(dāng)已登錄過(guò)（也就是說(shuō)有session值），就直接顯示username。

這個(gè)例子涉及到模板（hbs）和response的方法（redirect）可以先不管。

三、中間件理解

寫到最后了，回到最開(kāi)始的問(wèn)題，你是否理解了什么是Express中間件？

結(jié)合上面講解時(shí)給出的例子，我們先來(lái)分析一下從瀏覽器地址欄輸入url到客戶端顯示數(shù)據(jù)之間這個(gè)過(guò)程到底發(fā)生了什么。

瀏覽器向服務(wù)器發(fā)送一個(gè)請(qǐng)求后，服務(wù)器直接通過(guò)request.定位屬性的方式得到通過(guò)request攜帶過(guò)去的數(shù)據(jù)（有用戶輸入的數(shù)據(jù)和瀏覽器本身的數(shù)據(jù)信息）。這中間就一定有一個(gè)函數(shù)將這些數(shù)據(jù)分類做了處理，已經(jīng)處理好了，最后讓request對(duì)象調(diào)用使用，對(duì)的，這個(gè)處理數(shù)據(jù)處理函數(shù)就是我們要說(shuō)的 中間件 。由此可見(jiàn)，中間件可以總結(jié)以下幾點(diǎn)：

1、封裝了一些處理一個(gè)完整事件的功能函數(shù)。

2、非內(nèi)置的中間件需要通過(guò)安裝后，require到文件就可以運(yùn)行。

3、封裝了一些或許復(fù)雜但肯定是通用的功能。

以上所有代碼下載：https://github.com/wenpingzheng/express-js.git

以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

最新評(píng)論