Node后端Express框架安裝及應(yīng)用
Express 框架核心特性：
- 可以設(shè)置中間件來響應(yīng) HTTP 請(qǐng)求。
- 定義了路由表用于執(zhí)行不同的 HTTP 請(qǐng)求動(dòng)作。
- 可以通過向模板傳遞參數(shù)來動(dòng)態(tài)渲染 HTML 頁面。
Express安裝
express的使用過程有兩種方式：
- 方式一：通過express提供的腳手架，直接創(chuàng)建一個(gè)應(yīng)用的骨架；
- 方式二：從零搭建自己的express應(yīng)用結(jié)構(gòu)；
方式一：安裝express-generator
npm install -g express-generator
創(chuàng)建項(xiàng)目
express express-app
項(xiàng)目目錄如下
├── app.js
├── bin
│ └── www
├── package-lock.json
├── package.json
├── public
│ ├── images
│ ├── javascripts
│ └── stylesheets
│ └── style.css
├── routes
│ ├── index.js
│ └── users.js
└── views
├── error.jade
├── index.jade
└── layout.jade
之后 cd 進(jìn)入到對(duì)應(yīng)的目錄下，然后將項(xiàng)目跑起來：
npm install node bin/www node app.js
方式二： 自己搭建環(huán)境
上面通過express提供的腳手架，直接創(chuàng)建一個(gè)應(yīng)用的骨架；現(xiàn)在我們自己從零搭建項(xiàng)目：
初始化一個(gè)新的項(xiàng)目：
npm init -y
安裝express：
npm install express
新建app.js
express 初體驗(yàn)
現(xiàn)在搭建自己的第一個(gè)express程序：在app.js中加入如下代碼
const express = require('express');
// 創(chuàng)建服務(wù)器
const app = express();
app.get('/',(req,res) => {
res.end("Hello World");
});
app.listen(8000,() => {
console.log("服務(wù)器啟動(dòng)成功~");
})
進(jìn)入項(xiàng)目根目錄下，在終端中將服務(wù)器跑起來:
node app.js
到瀏覽器：訪問localhost:8000即可
請(qǐng)求和響應(yīng)
請(qǐng)求的路徑中如果有一些參數(shù)，可以這樣表達(dá)：
/users/:userId；
在request對(duì)象中要獲取可以通過req.params.userId;
返回?cái)?shù)據(jù)
返回?cái)?shù)據(jù)，我們可以方便的使用json：
res.json(數(shù)據(jù))方式；
const express = require('express');
const app = express();
app.get('/users/:userId', (req, res, next) => {
console.log(req.params.userId);
res.json({username: "liyingxia", password: "8i8i8i8i" });
});
app.listen(8000, () => {
console.log("靜態(tài)服務(wù)器啟動(dòng)成功~");
})
Express 中間件
認(rèn)識(shí)中間件
Express是一個(gè)路由和中間件的Web框架，它本身的功能非常少：
Express應(yīng)用程序本質(zhì)上是一系列中間件函數(shù)的調(diào)用；
中間是什么？
中間件的本質(zhì)就是一個(gè)回調(diào)函數(shù)；
這個(gè)回調(diào)函數(shù)接受三個(gè)參數(shù)：
請(qǐng)求對(duì)象（request對(duì)象）；
響應(yīng)對(duì)象（response對(duì)象）；
next函數(shù)（在express中定義的用于執(zhí)行下一個(gè)中間件的函數(shù)）；
中間件中可以執(zhí)行哪些任務(wù)？
執(zhí)行任何代碼；
更改請(qǐng)求（request）和響應(yīng)（response）對(duì)象；
結(jié)束請(qǐng)求-響應(yīng)周期（返回?cái)?shù)據(jù)）；
調(diào)用棧中的下一個(gè)中間件；
如果當(dāng)前中間件功能沒有結(jié)束請(qǐng)求-響應(yīng)周期，則必須調(diào)用 next()將控制權(quán)傳遞給下一個(gè)中間件功能，否則，請(qǐng)求將被掛起。
使用中間件
express主要提供了兩種方式：app/router.use和app/router.methods這兩種方式把中間件應(yīng)用到我們的應(yīng)用程序中；
methods指的是常用的請(qǐng)求方式，比如：app.get或app.post等
// express 中間件的使用
const express = require('express');
const res = require('express/lib/response');
const app = express();
app.use((req,res,next) => {
console.log("middleware");
next();
});
app.use((req,res,next) => {
console.log("middleware");
res.end("Hello Common Middleware");
})
app.listen(9000,()=>{
console.log("中間件服務(wù)器啟動(dòng)成功~")
})
path匹配中間件：
//path 路徑匹配中間件
app.use('/home',(req,res,next) => {
console.log("home middleware 中間件");
next();
});
app.use('/home',(req,res,next) => {
console.log("home middleware02");
next();
res.end("middleware");
});
app.use((req,res,next) =>{
console.log("middleware");
})
path 和 method 匹配中間件
// path 和 method 匹配中間件
app.get('/home',(req,res,next) => {
console.log("home get middleware");
next();
})
app.post('/login',(req,res,next) => {
console.log("login post middleware");
next();
});
app.use((req,res,next) => {
console.log("common middleware");
})
app.use(express.json());
app.use(express.urlencoded({extended:true}));
app.post('/login',(req,res,next) => {
console.log(req.body);
res.end("登陸成功~");
});
日志記錄中間件
如果我們希望將請(qǐng)求日志記錄下來，那么可以使用express官網(wǎng)開發(fā)的第三方庫(kù)：morgan
morgan安裝：
npm install morgan
如何用？直接作為中間件使用即可：
const loggerWriter = fs.createWriteStream('./log/access.log', {
flags: 'a+'
})
app.use(morgan('combined', {stream: loggerWriter}));
上傳文件中間件
圖片上傳我們可以使用express官方開發(fā)的第三方庫(kù)：multer
multer安裝：
npm install multer
上傳文件：
const upload = multer({
dest: "uploads/"
})
app.post('/upload', upload.single('file'), (req, res, next) => {
console.log(req.file.buffer);
res.end("文件上傳成功~");
})
添加上傳文件后綴名：
const storage = multer.diskStorage({
destination: (req, file, cb) => {
cb(null, "uploads/")
},
filename: (req, file, cb) => {
cb(null, Date.now() + path.extname(file.originalname));
}
})
const upload = multer({
storage
})
app.post('/upload', upload.single('file'), (req, res, next) => {
console.log(req.file.buffer);
res.end("文件上傳成功~");
})
上傳多張圖片:
app.use('/upload', upload.array('files'), (req, res, next) => {
console.log(req.files);
});
請(qǐng)求和響應(yīng)
客戶端傳遞到服務(wù)器參數(shù)的方法常見的是5種：
方式一：通過get請(qǐng)求中的URL的params；
方式二：通過get請(qǐng)求中的URL的query；
方式三：通過post請(qǐng)求中的body的json格式；
方式四：通過post請(qǐng)求中的body的x-www-form-urlencoded格式；
方式五：通過post請(qǐng)求中的form-data格式；
請(qǐng)求解析
方式一：params
請(qǐng)求地址： http://locahost:8000/login/asd/ass
獲取參數(shù)：
app.use('/login/:id/:name', (req, res, next) => {
console.log(req.params);
res.json("請(qǐng)求成功~");
})
方式二：query
請(qǐng)求地址：http://localhost:8000/login?username=liyingxia&password=123456
獲取參數(shù)：
app.use('/login', (req, res, next) => {
console.log(req.query);
res.json("請(qǐng)求成功~");
})
方式三：通過post請(qǐng)求中的body的json格式；
在客戶端發(fā)送post請(qǐng)求時(shí)，會(huì)將數(shù)據(jù)放到body中：客戶端可以通過json的方式傳遞，也可以通過form表單的方式傳遞；
自己編寫中間件來解析JSON：
app.use((req, res, next) => {
if (req.headers['content-type'] === 'application/json') {
req.on('data', (data) => {
const userInfo = JSON.parse(data.toString());
req.body = userInfo;
})
req.on('end', () => {
next();
})
} else {
next();
}
})
app.post('/login', (req, res, next) => {
console.log(req.body);
res.end("登錄成功~");
});
適用express內(nèi)置的中間件或者使用body-parser來完成：
app.use(express.json());
app.post('/login', (req, res, next) => {
console.log(req.body);
res.end("登錄成功~");
});
方式四：通過post請(qǐng)求中
body的x-www-form-urlencoded格式；
解析application/x-www-form-urlencoded：
可以使用express自帶的 urlencoded函數(shù)來作為中間件：
傳入的extended用于表示使用哪一種解析方式：
- true：使用
qs第三方模塊； - false：使用
querystring內(nèi)置模塊；
app.use(express.json());
app.use(express.urlencoded({extended: true}));
app.post('/login', (req, res, next) => {
console.log(req.body);
res.end("登錄成功~");
});
方式五：通過post請(qǐng)求中的form-data格式；
通過any借助multer去解析一些form-data中的普通數(shù)據(jù):
app.use(upload.any());
app.use('/login', (req, res, next) => {
console.log(req.body);
});
響應(yīng)方式
end()類似于http中的response.end方法；
res.end("獲取成功~")
json()json方法中可以傳入很多的類型：
object、array、string、boolean、number、null等，都會(huì)被轉(zhuǎn)換成json格式返回
res.json({name:"liyignxia",password:"123456"});
status()設(shè)置狀態(tài)碼
res.status(200);
路由的使用
使用express.Router來創(chuàng)建一個(gè)路由處理程序：一個(gè)Router實(shí)例擁有完整的中間件和路由系統(tǒng)；
// 用戶相關(guān)的處理
const userRouter = express.Router();
userRouter.get('/', (req, res, next) => {
res.end("用戶列表");
});
userRouter.post('/', (req, res, next) => {
res.end("創(chuàng)建用戶");
});
userRouter.delete('/', (req, res, next) => {
res.end("刪除用戶");
});
app.use('/users', userRouter);
靜態(tài)資源服務(wù)器
Node也可以作為靜態(tài)資源服務(wù)器，并且express給我們提供了方便部署靜態(tài)資源的方法；
const express = require('express');
const app = express();
app.use(express.static('./build'));
app.listen(8000, () => {
console.log("靜態(tài)服務(wù)器啟動(dòng)成功~");
})
錯(cuò)誤處理方式
app.use((req, res, next) => {
next(new Error("USER DOES NOT EXISTS"));
});
app.use((err, req, res, next) => {
const message = err.message;
switch (message) {
case "USER DOES NOT EXISTS":
res.status(400).json({message})
}
res.status(500)
})
相關(guān)文章
這篇文章主要介紹了git 將本地文件(夾)上傳到gitee指定分支的處理方法,本文給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2020-09-09
這篇文章主要介紹了分享幾個(gè)新增備案不關(guān)站的代碼,需要的朋友可以參考下2015-01-01
都說 StringBuilder 在處理字符串拼接上效率要強(qiáng)于 String，但有時(shí)候我們的理解可能會(huì)存在一定的偏差。今天小編給大家?guī)硪黄坛剃P(guān)于StringBuider 在什么條件下、如何使用效率更高？感興趣的朋友一起看看吧2020-06-06
這篇文章主要為大家介紹了ElasticSearch寫入流程實(shí)例解析，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-09-09
這是一篇程序員寫給程序員的趣味讀物。所謂趣味是指可以比較輕松地了解一些原來不清楚的概念，增進(jìn)知識(shí)，類似于打RPG游戲的升級(jí)。整理這篇文章的動(dòng)機(jī)是兩個(gè)問題2012-08-08
使用Postman和SoapUI工具測(cè)試WebService接口
這篇文章介紹了使用Postman和SoapUI工具測(cè)試WebService接口的方法，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2022-06-06
本文主要介紹了Git撤銷操作、刪除文件和恢復(fù)文件的方法。具有很好的參考價(jià)值，下面跟著小編一起來看下吧2017-02-02
關(guān)于指令重排現(xiàn)象的兩個(gè)階段詳解
這個(gè)知識(shí)點(diǎn)也是很多人說不清道不明的地方，感覺都知道，說又說不出來。為什么會(huì)這樣呢？因?yàn)檫@幾個(gè)字，很容易被當(dāng)成動(dòng)詞去理解，其實(shí)正確的理解是當(dāng)成名詞，即指令重排現(xiàn)象2022-01-01
這篇文章主要介紹了Git如何修改已提交的commit注釋問題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2023-05-05
這篇文章主要為大家介紹了滑動(dòng)窗口算法高效率解決數(shù)組問題詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2023-05-05