上一篇：Node.js Web 模塊下一篇：Node.js RESTful API

Node.js Express 框架

Express 簡(jiǎn)介

Express 是一個(gè)簡(jiǎn)潔而靈活的 node.js Web應(yīng)用框架, 提供了一系列強(qiáng)大特性幫助你創(chuàng)建各種 Web 應(yīng)用，和豐富的 HTTP 工具。

使用 Express 可以快速地搭建一個(gè)完整功能的網(wǎng)站。

Express 框架核心特性：

可以設(shè)置中間件來(lái)響應(yīng) HTTP 請(qǐng)求。
定義了路由表用于執(zhí)行不同的 HTTP 請(qǐng)求動(dòng)作。
可以通過(guò)向模板傳遞參數(shù)來(lái)動(dòng)態(tài)渲染 HTML 頁(yè)面。

安裝 Express

安裝 Express 并將其保存到依賴(lài)列表中：

$ cnpm install express --save

以上命令會(huì)將 Express 框架安裝在當(dāng)前目錄的 node_modules 目錄中， node_modules 目錄下會(huì)自動(dòng)創(chuàng)建 express 目錄。以下幾個(gè)重要的模塊是需要與 express 框架一起安裝的：

body-parser - node.js 中間件，用于處理 JSON, Raw, Text 和 URL 編碼的數(shù)據(jù)。
cookie-parser - 這就是一個(gè)解析Cookie的工具。通過(guò)req.cookies可以取到傳過(guò)來(lái)的cookie，并把它們轉(zhuǎn)成對(duì)象。
multer - node.js 中間件，用于處理 enctype="multipart/form-data"（設(shè)置表單的MIME編碼）的表單數(shù)據(jù)。

$ cnpm install body-parser --save
$ cnpm install cookie-parser --save
$ cnpm install multer --save

安裝完后，我們可以查看下 express 使用的版本號(hào)：

$ cnpm list express
/data/www/node
└── express@4.15.2  -> /Users/tianqixin/www/node/node_modules/.4.15.2@express

第一個(gè) Express 框架實(shí)例

接下來(lái)我們使用 Express 框架來(lái)輸出 "Hello World"。

以下實(shí)例中我們引入了 express 模塊，并在客戶(hù)端發(fā)起請(qǐng)求后，響應(yīng) "Hello World" 字符串。

創(chuàng)建 express_demo.js 文件，代碼如下所示：

express_demo.js 文件代碼：

//express_demo.js 文件 var express = require('express'); var app = express(); app.get('/', function (req, res) { res.send('Hello World'); }) var server = app.listen(8081, function () { var host = server.address().address var port = server.address().port console.log("應(yīng)用實(shí)例，訪(fǎng)問(wèn)地址為 http://%s:%s", host, port) })

執(zhí)行以上代碼：

$ node express_demo.js 
應(yīng)用實(shí)例，訪(fǎng)問(wèn)地址為 http://0.0.0.0:8081

在瀏覽器中訪(fǎng)問(wèn) http://127.0.0.1:8081，結(jié)果如下圖所示：

請(qǐng)求和響應(yīng)

Express 應(yīng)用使用回調(diào)函數(shù)的參數(shù)： request 和 response 對(duì)象來(lái)處理請(qǐng)求和響應(yīng)的數(shù)據(jù)。

app.get('/', function (req, res) {
   // --
})

request 和 response 對(duì)象的具體介紹：

Request 對(duì)象 - request 對(duì)象表示 HTTP 請(qǐng)求，包含了請(qǐng)求查詢(xún)字符串，參數(shù)，內(nèi)容，HTTP 頭部等屬性。常見(jiàn)屬性有：

req.app：當(dāng)callback為外部文件時(shí)，用req.app訪(fǎng)問(wèn)express的實(shí)例
req.baseUrl：獲取路由當(dāng)前安裝的URL路徑
req.body / req.cookies：獲得「請(qǐng)求主體」/ Cookies
req.fresh / req.stale：判斷請(qǐng)求是否還「新鮮」
req.hostname / req.ip：獲取主機(jī)名和IP地址
req.originalUrl：獲取原始請(qǐng)求URL
req.params：獲取路由的parameters
req.path：獲取請(qǐng)求路徑
req.protocol：獲取協(xié)議類(lèi)型
req.query：獲取URL的查詢(xún)參數(shù)串
req.route：獲取當(dāng)前匹配的路由
req.subdomains：獲取子域名
req.accepts()：檢查可接受的請(qǐng)求的文檔類(lèi)型
req.acceptsCharsets / req.acceptsEncodings / req.acceptsLanguages：返回指定字符集的第一個(gè)可接受字符編碼
req.get()：獲取指定的HTTP請(qǐng)求頭
req.is()：判斷請(qǐng)求頭Content-Type的MIME類(lèi)型

Response 對(duì)象 - response 對(duì)象表示 HTTP 響應(yīng)，即在接收到請(qǐng)求時(shí)向客戶(hù)端發(fā)送的 HTTP 響應(yīng)數(shù)據(jù)。常見(jiàn)屬性有：

res.app：同req.app一樣
res.append()：追加指定HTTP頭
res.set()在res.append()后將重置之前設(shè)置的頭
res.cookie(name，value [，option])：設(shè)置Cookie
opition: domain / expires / httpOnly / maxAge / path / secure / signed
res.clearCookie()：清除Cookie
res.download()：傳送指定路徑的文件
res.get()：返回指定的HTTP頭
res.json()：傳送JSON響應(yīng)
res.jsonp()：傳送JSONP響應(yīng)
res.location()：只設(shè)置響應(yīng)的Location HTTP頭，不設(shè)置狀態(tài)碼或者close response
res.redirect()：設(shè)置響應(yīng)的Location HTTP頭，并且設(shè)置狀態(tài)碼302
res.render(view,[locals],callback)：渲染一個(gè)view，同時(shí)向callback傳遞渲染后的字符串，如果在渲染過(guò)程中有錯(cuò)誤發(fā)生next(err)將會(huì)被自動(dòng)調(diào)用。callback將會(huì)被傳入一個(gè)可能發(fā)生的錯(cuò)誤以及渲染后的頁(yè)面，這樣就不會(huì)自動(dòng)輸出了。
res.send()：傳送HTTP響應(yīng)
res.sendFile(path [，options] [，fn])：傳送指定路徑的文件 -會(huì)自動(dòng)根據(jù)文件extension設(shè)定Content-Type
res.set()：設(shè)置HTTP頭，傳入object可以一次設(shè)置多個(gè)頭
res.status()：設(shè)置HTTP狀態(tài)碼
res.type()：設(shè)置Content-Type的MIME類(lèi)型

路由

我們已經(jīng)了解了 HTTP 請(qǐng)求的基本應(yīng)用，而路由決定了由誰(shuí)(指定腳本)去響應(yīng)客戶(hù)端請(qǐng)求。

在HTTP請(qǐng)求中，我們可以通過(guò)路由提取出請(qǐng)求的URL以及GET/POST參數(shù)。

接下來(lái)我們擴(kuò)展 Hello World，添加一些功能來(lái)處理更多類(lèi)型的 HTTP 請(qǐng)求。

創(chuàng)建 express_demo2.js 文件，代碼如下所示：

express_demo2.js 文件代碼：

執(zhí)行以上代碼：

$ node express_demo2.js 
應(yīng)用實(shí)例，訪(fǎng)問(wèn)地址為 http://0.0.0.0:8081

接下來(lái)你可以嘗試訪(fǎng)問(wèn) http://127.0.0.1:8081 不同的地址，查看效果。

在瀏覽器中訪(fǎng)問(wèn) http://127.0.0.1:8081/list_user，結(jié)果如下圖所示：

在瀏覽器中訪(fǎng)問(wèn) http://127.0.0.1:8081/abcd，結(jié)果如下圖所示：

在瀏覽器中訪(fǎng)問(wèn) http://127.0.0.1:8081/abcdefg，結(jié)果如下圖所示：

靜態(tài)文件

Express 提供了內(nèi)置的中間件 express.static 來(lái)設(shè)置靜態(tài)文件如：圖片， CSS, JavaScript 等。

你可以使用 express.static 中間件來(lái)設(shè)置靜態(tài)文件路徑。例如，如果你將圖片， CSS, JavaScript 文件放在 public 目錄下，你可以這么寫(xiě)：

app.use('/public', express.static('public'));

我們可以到 public/images 目錄下放些圖片,如下所示：

node_modules
server.js
public/
public/images
public/images/logo.png

讓我們?cè)傩薷南?"Hello World" 應(yīng)用添加處理靜態(tài)文件的功能。

創(chuàng)建 express_demo3.js 文件，代碼如下所示：

express_demo3.js 文件代碼：

var express = require('express'); var app = express(); app.use('/public', express.static('public')); app.get('/', function (req, res) { res.send('Hello World'); }) var server = app.listen(8081, function () { var host = server.address().address var port = server.address().port console.log("應(yīng)用實(shí)例，訪(fǎng)問(wèn)地址為 http://%s:%s", host, port) })

執(zhí)行以上代碼：

$ node express_demo3.js 
應(yīng)用實(shí)例，訪(fǎng)問(wèn)地址為 http://0.0.0.0:8081

執(zhí)行以上代碼：

在瀏覽器中訪(fǎng)問(wèn) http://127.0.0.1:8081/public/images/logo.png（本實(shí)例采用了小白教程的 logo），結(jié)果如下圖所示：

GET 方法

以下實(shí)例演示了在表單中通過(guò) GET 方法提交兩個(gè)參數(shù)，我們可以使用 server.js 文件內(nèi)的 process_get 路由器來(lái)處理輸入：

index.html 文件代碼：

<html> <body> <form action="http://127.0.0.1:8081/process_get" method="GET"> First Name: <input type="text" name="first_name"> <br> Last Name: <input type="text" name="last_name"> <input type="submit" value="Submit"> </form> </body> </html>

server.js 文件代碼：

執(zhí)行以上代碼：

node server.js 
應(yīng)用實(shí)例，訪(fǎng)問(wèn)地址為 http://0.0.0.0:8081

瀏覽器訪(fǎng)問(wèn) http://127.0.0.1:8081/index.html，如圖所示：

現(xiàn)在你可以向表單輸入數(shù)據(jù)，并提交，如下演示：

POST 方法

以下實(shí)例演示了在表單中通過(guò) POST 方法提交兩個(gè)參數(shù)，我們可以使用 server.js 文件內(nèi)的 process_post 路由器來(lái)處理輸入：

index.html 文件代碼：

<html> <body> <form action="http://127.0.0.1:8081/process_post" method="POST"> First Name: <input type="text" name="first_name"> <br> Last Name: <input type="text" name="last_name"> <input type="submit" value="Submit"> </form> </body> </html>

server.js 文件代碼：

執(zhí)行以上代碼：

$ node server.js
應(yīng)用實(shí)例，訪(fǎng)問(wèn)地址為 http://0.0.0.0:8081

瀏覽器訪(fǎng)問(wèn) http://127.0.0.1:8081/index.html，如圖所示：

現(xiàn)在你可以向表單輸入數(shù)據(jù)，并提交，如下演示：

文件上傳

以下我們創(chuàng)建一個(gè)用于上傳文件的表單，使用 POST 方法，表單 enctype 屬性設(shè)置為 multipart/form-data。

index.html 文件代碼：

<html> <head> <title>文件上傳表單</title> </head> <body> <h3>文件上傳：</h3> 選擇一個(gè)文件上傳: <br /> <form action="/file_upload" method="post" enctype="multipart/form-data"> <input type="file" name="image" size="50" /> <br /> <input type="submit" value="上傳文件" /> </form> </body> </html>

server.js 文件代碼：

執(zhí)行以上代碼：

$ node server.js 
應(yīng)用實(shí)例，訪(fǎng)問(wèn)地址為 http://0.0.0.0:8081

瀏覽器訪(fǎng)問(wèn) http://127.0.0.1:8081/index.html，如圖所示：

現(xiàn)在你可以向表單輸入數(shù)據(jù)，并提交，如下演示：

Cookie 管理

我們可以使用中間件向 Node.js 服務(wù)器發(fā)送 cookie 信息，以下代碼輸出了客戶(hù)端發(fā)送的 cookie 信息：

express_cookie.js 文件代碼：

// express_cookie.js 文件 var express = require('express') var cookieParser = require('cookie-parser') var util = require('util'); var app = express() app.use(cookieParser()) app.get('/', function(req, res) { console.log("Cookies: " + util.inspect(req.cookies)); }) app.listen(8081)

執(zhí)行以上代碼：

$ node express_cookie.js

現(xiàn)在你可以訪(fǎng)問(wèn) http://127.0.0.1:8081 并查看終端信息的輸出，如下演示：

中文字幕一区二区人妻电影,亚洲av无码一区二区乱子伦as ,亚洲精品无码永久在线观看,亚洲成aⅴ人片久青草影院按摩,亚洲黑人巨大videos

Node.js Express 框架

Express 簡(jiǎn)介

安裝 Express

第一個(gè) Express 框架實(shí)例

express_demo.js 文件代碼：

請(qǐng)求和響應(yīng)

路由

express_demo2.js 文件代碼：

靜態(tài)文件

express_demo3.js 文件代碼：

GET 方法

index.html 文件代碼：

server.js 文件代碼：

POST 方法

index.html 文件代碼：

server.js 文件代碼：

文件上傳

index.html 文件代碼：

server.js 文件代碼：

Cookie 管理

express_cookie.js 文件代碼：

相關(guān)資料