express 框架

Express 可以方便，快速的創(chuàng)建 Wed 的服務器或 API 接口的服務器

EXpress 介紹

--Express 是基于 Node.js 平臺，快速，開放，極簡的 Web 開發(fā)框架。 --通俗理解：Express 的作用和 Node.js 內(nèi)置的 http 模塊類似，是專門用來創(chuàng)建 Web 服務器的 --Express 本質(zhì)就是 npm 上的第三方包

Express 的基本使用

第一步：安裝

--在項目所在的目錄終端進行安裝 npm i express

第二步：創(chuàng)建基本的 Web 服務器

// 導入服務器 const express = require("express"); // 創(chuàng)建服務器 const app = express(); // 啟動服務器 app.listen(80, () => { console.log("http://127.0.0.1"); });

第三步：監(jiān)聽 post 請求

通過 app.post() 方法，可以監(jiān)聽客戶端的 POST 請求，具體的語法格式如下：//參數(shù) 1：客戶端請求的 URL 地址 //參數(shù) 2：請求對應的處理的數(shù) //req：請求對象（包含了與請求相關(guān)的屬性與方法） //res：響應對象（包含了與響應相關(guān)的屬性與方法）app.post("請求 URL", function (req, res) { /_處理的數(shù)_/ });

第四步：監(jiān)聽 get 請求

通過 app.get0方法，可以監(jiān)聽客戶端的GET請求，具體的語法格式如下：//參數(shù)1：客戶端請求的 URL地址 //參數(shù)2：請求對應的處理函數(shù) //req：請求對象（包含了與請求相關(guān)的屬性與方法） //res：晌應對象（包含了與響應相關(guān)的屬性與方法）app.get('請求uRL',function(req,res){/*處理的數(shù)*/})

第五步：把內(nèi)容響應給客戶端

通過res.send0方法，可以把處理好的內(nèi)容，發(fā)送給客戶端：app.get('/user',(req, res) => ( //向客戶滿發(fā)送JSON對象 res.send({name:‘zs',age:20,gender:‘男}) })app-post('/user', (req, res) => ( //向宣戶滿發(fā)送義本內(nèi)容 res.send('請求成功”) })

托管靜態(tài)資源

express.static()

express 提供了一個非常好用的函數(shù)，叫做 express.static（）.通過它，我們可以非常方便地創(chuàng)建一個靜態(tài)資源服務器，

例如，通過如下代碼就可以將public目錄下的圖片、CSS文件、JavaScript文件對外開放訪問了： app.use(express.static('public'))

現(xiàn)在，你就可以訪問 public 目錄中的所有文件了：

http://localhost:3000/images/bg.jpg

http://localhost:3000/css/style.css

http://localhost:3000/js/login.js

注意：Express 在指定的靜態(tài)目錄中查找文件，并對外提供資源的訪問路徑。
因此，存放靜態(tài)文件的目錄名不會出現(xiàn)在 URL 中。

提示：public 和 files 是文件夾名,app(Web 服務器)

托管多個靜態(tài)資源目錄

如果要托管多個靜態(tài)資源目錄，請多次調(diào)用 express.static() 函數(shù)：

app.use(express.static('public'))app.use(express.static('files'))

訪問靜態(tài)資源文件時，express.static() 函數(shù)會根據(jù)目錄的添加順序查找所需的文件。

掛載路徑前綴

如果希望在托管的靜態(tài)資源訪問路徑之前，掛載路徑前綴，則可以使用如下的方式：

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

現(xiàn)在，你就可以通過帶有/public 前綴地址來訪問 public 目錄中的文件了：

http://localhost:3000/public/images/kitten.jpg

http://localhost:3000/public/css/style.css

http://localhost:3000/public/js/app.js

為什么要使用 nodemon

在編寫調(diào)試 Node.js 項目的時候，如果修改了項目的代碼，則需要頻繁的手動 close 掉，然后再重新啟動，非常繁瑣。現(xiàn)在,我們可以使用 nodemon(https://www.npmjs.com/package/nodemon)這個工具，它能夠監(jiān)聽項目文件的變動，當代碼被修改后，nodemon 會自動幫我們重啟項目，極大方便了開發(fā)和調(diào)試。

安裝 nodemon

在終端中，運行如下命令，即可將 nodemon 安裝為全局可用的工具：

npm install nodemon -g

使用 nodemon

當基于 Nodejs 編寫了一個網(wǎng)站應用的時候，傳統(tǒng)的方式，是運行 node app.js 命令，來啟動項目。這樣做的壞處是：
代碼被修改之后，需要手動重啟項目。
現(xiàn)在，我們可以將 node 命令替換為 nodemon 命令，使用 nodemon app.js 來啟動項目。這樣做的好處是：代碼
被修改之后，會被 nodemon 監(jiān)聽到，從而實現(xiàn)自動重啟項目的效果。

node app.js#將上面的終端命令，替換為下面的終鍵命令，即可實現(xiàn)自動重啟項目的效果 nodemon app. js

Express 中的路由

Express 的語法格式

在 Express 中，路由指的是客戶端的請求與服務器處理函數(shù)之間的映射關(guān)系。
Express 中的路由分 3 部分組成，分別是請求的類型、請求的 URL 地址、處理函數(shù)，格式如下：

//app(Web服務器) app.METHOD(PATH, HANDLER)//請求的類型（METHOD）:post/get//請求的URL地址：PATH//處理函數(shù)

Express 中路由的例子

Express 中的路由的例子

//app(Web服務器) //四配GET請求，且請求URL為/ app.get('/', function (req, res) (res.send('Hello World!') })//匹配POST 請求，且請求 URL為/ app.post('/', function (req, res) {res.send('Got a POST request') })

路由的匹配過程

每當一個請求到達服務器之后，需要先經(jīng)過路由的匹配，只有匹配成功之后，才會調(diào)用對應的處理函數(shù)。

在匹配時，會按照路由的順序進行匹配，如果請求類型和請求的 URL 同時匹配成功，則 Express 會將這次請求，轉(zhuǎn)
交給對應的 function 函數(shù)進行處理。

路由匹配的注意點：

1·按照定義的先后順序進行匹配

2.請求類型和請求的 URL 同時匹配成功，
才會調(diào)用對應的處理函數(shù)

路由的使用

最簡單的用法

在 Express 中使用路由最簡單的方式，就是把路由掛載到 app 上，示例代碼如下：

const express ? require('express')//創(chuàng)建 web 服務器，命名為 appconst app = express()//掛載路由app.get('/'. (reg, res) => {res.send('Hello world.')} )app.post('/', (req, res) => {( res.send('Post Request.') })//啟動 web 服勢器app.1isten(80, () > { console.log("server running at htrp://127.0.0.1") })

模塊化路由

為了方便對路由進行橫塊化的管理，Express 不建議將路由直接掛戟到 app 上，而是推薦將路由抽離為單獨的橫塊。

將路由抽離為單獨模塊的步驟如下：

① 創(chuàng)建路由模塊對應的.js 文件

② 調(diào)用 express.Router()函數(shù)創(chuàng)建路由對象

③ 向路由對象上掛載具體的路由

④ 使用 module.exports 向外共享路由對象

⑤ 使用 app.use0 函數(shù)注冊路由模塊

創(chuàng)建路由模塊例子：

var express = require('express') //導入 express//創(chuàng)建路由對象 var router = express.Router()router.get('/user/list',function(req,res){ //3.掛載獲取用戶列表的路由res.send('Get user list.‘) }) router.post(/user/add',function(req,res){//4.掛載添加用戶的路由 res.send('Add new user.') })module.exports = router //向外導出路由對象

注冊路由模塊

//1.導入路由模塊 const userRouter =require('./router/user.js')// 2.使用 app.use（）注冊路由模塊 app.use(userRouter)

為路由模塊添加前綴

類似于托管靜態(tài)資源時，為靜態(tài)資源統(tǒng)一掛載訪問前綴一樣，路由模塊添加前綴的方式也非常簡單：

//1.導入路由模塊 const userRouter = require('./router/user.js')// 2.使用 app.use（）注冊路由模塊，并添加統(tǒng)一的訪問前綴/api app.use('/api', userRouter)

Express 中間件

Express 中間件的調(diào)用流程

當一個請求到達 Express 的服務器之后，可以連續(xù)調(diào)用多個中間件，從而對這次請求進行預處理。

Express 中間件的格式

Express 的中間件，本質(zhì)上就是一個 function 處理函數(shù)，Express 中間件的格式如下：

var express=require("express")var app=express()app.get("/",function(req,res,next){next();}) app.listen(80,function(){})

注意：中間件函數(shù)的形參列表中，必須包含 next 函數(shù)。路由處理函數(shù)中只包含 res,req。

next 函數(shù)的作用

next 函數(shù)是實現(xiàn)多個中間件連續(xù)調(diào)用的關(guān)鍵，它表示把流轉(zhuǎn)關(guān)系轉(zhuǎn)交給下一個中間件或路由。

定義中間件函數(shù)

可以通過如下的方式，定義一個最簡單的中間件函數(shù)：

//常量mw所指向的，就是一個中間件函數(shù) const mw = function (req, res, next) {console.log（“這是一個最簡單的中間件函數(shù)”）//注意：在當前中間件的業(yè)務處理完畢后，必須調(diào)用 next（）的數(shù) //表示把流轉(zhuǎn)關(guān)系轉(zhuǎn)交給下一個中間件或路由 next() }

全局生效的中間件

客戶端發(fā)起的任何請求，到達服務器之后，都會觸發(fā)的中間件，叫做全局生效的中間件。

通過調(diào)用 app.use（中間件函數(shù)），即可定義一個全局生效的中間件，示例代碼如下：

//常量mw所指向的，就是一個中間件函數(shù) const mw = function (req, res, next) ( console.log(“這是一個最簡單的的中間件函數(shù)') next() }//全局生效的中間件 app.use(mw);

定義全局中間件的簡化形式

//全局生效的中間件 app.use(function (req. res, next) ( console.log（“這是一個最簡單的中間件函數(shù)數(shù)”） next(); })

局部生效的中間件

不使用 app.use0 定義的中間件，叫做局部生效的中間件，示例代碼如下：

//定義中間件函數(shù) mw1 const mw1 = function(req, res, next) {console.log('這是中間件函數(shù)'） next()}//mw1 這個中間件只在”當前路由中生效”，這種用法屬于“局部生效的中間件“ app.get('/',mw1, function(req, res){res.send('Home page.')}) //mw1 這個中間件不會影響下面這個路由， app.get('/user', function(req, res) { res.send('User page.') })

定義多個局部中間件

可以在路由中，通過如下兩種等價的方式，使用多個局部中間件：

//以下兩種寫法是“完全等價"的，可根據(jù)自己的喜好，選擇任意一種方式進行使用 app.get('/',mw1,mw2, (req,res) =>{ res.send('Home page.')}app.get('/', [mw1, mw2], (req, res) => { res.send('Home page.') })

了解中間件的 5 個使用注意事項

① 一定要在路由之前注冊中間件

② 客戶端發(fā)送過來的請求，可以連續(xù)調(diào)用多個中間件進行處理

③ 執(zhí)行完中間件的業(yè)務代碼之后，不要忘記調(diào)用 next0 函數(shù)

④ 為了防止代碼邏輔混亂，調(diào)用 next（）函數(shù)后不要再寫額外的代碼

⑤ 連續(xù)調(diào)用多個中間件時，多個中間件之間，共享 req 和 res 對象

中間件的分類

為了方便大家理解和記憶中間件的使用，Express 官方把常見的中間件用法，分成了 5 大類，分別是：

① 應用級別的中間件

② 路由級別的中間件

③ 錯誤級別的中間件

④Express 內(nèi)置的中間件

⑤ 第三方的中間件

應用級別的中間件

通過 app.use（）或 app.get（）或 app.post（），綁定到 app 實例上的中間件，叫做應用級別的中間件，代碼示例如下：

//應用級別的中間件（全局中間件） app.use((req, res, next) => {next()})//應用級別的中間件（局部中間件） app.get('/', mw1, (req, res) => {res.send('Home page.')})

路由級別的中間件

綁定到 express.Router()實例上的中間件，叫做路由級別的中間件。它的用法和應用級別中間件沒有任何區(qū)別。只不過，應用級別中間件是綁定到 app 實例上，路由級別中間件綁定到 router 實例上，代碼示例如下：

var app = express() var router = express.Router()//路由級別的中間件 router.use(function (req,res,next) { console.log('Time:', Date.now()) next() })app.use('/', router)

錯誤級別的中間件

錯誤級別中間件的作用：專門用來捕獲整個項目中發(fā)生的異常錯誤，從而防止項目異常崩潰的問題。
格式：錯誤級別中間件的 function 處理函數(shù)中，必須有 4 個形參，形參順序從前到后，分別是（err,req,res,next)。

app.get('/', function (req, res) { //路由 throw new Error（'服務器內(nèi)部發(fā)生了錯誤！')// 1.1 拋出一個自定義的錯誤res.sènd('Home Page.') }) app.use(function(err,req,res,next){// 2.錯誤級別的中間件console.log('發(fā)生了錯誤：'+err.message)//2.1 在服務器打印錯誤消息res.send('Error!'+ err.message)//向客戶端響應錯誤相關(guān)的內(nèi)容 })

Express 內(nèi)置的中間件

自 Express 4.16.0 版本開始，Express 內(nèi)置了 3 個常用的中間件，極大的提高了 Express 項目的開發(fā)效率和體驗：

①express.static 快速托管靜態(tài)資源的內(nèi)置中間件，例如：HTML 文件、圖片、CSS 樣式等（無兼容性）

②express.json 解析 JSON 格式的請求體數(shù)據(jù)（有兼容性，僅在 4.16.0+版本中可用）

③express.urlencoded 解析 URL-encoded 格式的請求體數(shù)據(jù)（有兼容性，僅在 4.16.0+版本中可用）

//配置解析 application/json 格式數(shù)據(jù)的內(nèi)置中間件app.use(express.json())//配置解析 application/x-ww-form-urlencoded 格式數(shù)據(jù)的內(nèi)置中間件app.use(express.urlencoded({ extended: false }))

注意：除了錯誤級別的中間件，其他的中間件，必須在路由之前進行配置

第三方的中間件

非 Express 官方內(nèi)置的，而是由第三方開發(fā)出來的中間件，叫做第三方中間件。在項目中，大家可以按需下載并配置
第三方中間件，從而提高項目的開發(fā)效率。
例如：在express@4.16.0之前的版本中，經(jīng)常使用 body-parser 這個第三方中間件，來解析請求體數(shù)據(jù)。使用步
驟如下：

① 運行 npm install body-parser 安裝中間件

② 使用 require 導入中間件

③ 調(diào)用 app.use() 注冊并使用中間件

總結(jié)

以上是生活随笔為你收集整理的express-PPT的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。