本篇文章帶大家了解一下Node第三方框架Express,簡(jiǎn)單聊聊如何使用好Express框架,希望對(duì)大家有所幫助!
1.Express框架介紹
-
1.Express是Nodejs開(kāi)發(fā)中一個(gè)非常重量級(jí)的第三方框架,它對(duì)于NodeJS服務(wù)端就相當(dāng)于Jquery對(duì)于HTML客戶端。
- 如果連Express都不會(huì)用,基本上都不好意思跟別人說(shuō)你會(huì)NodeJS
-
2.Express官網(wǎng):
-
www.expressjs.com.cn/
-
expressjs.com/
- 一般我們學(xué)習(xí)一個(gè)新的技術(shù),都是去官網(wǎng)文檔查看它的API,然后多多嘗試,熟能生巧
-
-
3.Express的github地址:https://github.com/expressjs/express
- Express的原作者TJ在node社區(qū)非常的有名,他寫過(guò)200多個(gè)框架,目前他已經(jīng)將Express交給了朋友維護(hù),宣布不再維護(hù)NodeJS框架,轉(zhuǎn)向Go語(yǔ)言(https://github.com/tj)
-
4.Express官網(wǎng)是這樣介紹自己的:基于 Node.js 平臺(tái),快速、開(kāi)放、極簡(jiǎn)的 web 開(kāi)發(fā)框架。
-
Express一個(gè)非常重要的亮點(diǎn)就是它沒(méi)有改變nodejs已有的特性,而是在它的基礎(chǔ)上進(jìn)行了拓展
- 也就是說(shuō),使用Express你既可以使用nodejs原生的任何API,也能使用Express的API
-
-
5.Express三大核心功能
-
1.托管靜態(tài)資源
- 第二天講的nodejs實(shí)現(xiàn)靜態(tài)服務(wù)器功能在express中只需要一行代碼
-
2.路由
- express自帶路由功能,讓Node服務(wù)端開(kāi)發(fā)變得極其簡(jiǎn)單
- express支持鏈?zhǔn)秸Z(yǔ)法,可以讓代碼看起來(lái)更加簡(jiǎn)潔
-
==3.中間件==
-
Express最為核心的技術(shù)和思想,萬(wàn)物皆中間件
- 中間件雖然理解起來(lái)有點(diǎn)困難,但是使用起來(lái)非常方便,類似于
bootstrap插件
.
- 中間件雖然理解起來(lái)有點(diǎn)困難,但是使用起來(lái)非常方便,類似于
-
-
2.下載express
下載指令: npm i express
如果你的網(wǎng)站很慢,可以使用npm config set registry registry.npm.taobao.org/來(lái)提升速度
就是淘寶幫你把這個(gè)東西下載淘寶的服務(wù)器上,然后你在淘寶服務(wù)器上下載
3.使用Express
//1.導(dǎo)入模塊 const express = require('express') //2.創(chuàng)建服務(wù)器 /* express() 相當(dāng)于http模塊的http.createServer() */ const app = express() //3.接收客戶端請(qǐng)求 /*(1)express最大的特點(diǎn)就是自帶路由功能,我們無(wú)需在一個(gè)方法中處理所有請(qǐng)求 * 路由:一個(gè)請(qǐng)求路徑對(duì)應(yīng)一個(gè)方法(函數(shù)) (2)在express中,每一個(gè)請(qǐng)求都是一個(gè)單獨(dú)的方法 */ app.get('/',(req,res)=>{ //響應(yīng)客戶端數(shù)據(jù) //express響應(yīng)數(shù)據(jù) send方法:自動(dòng)幫我們?cè)O(shè)置好了響應(yīng)頭,無(wú)需擔(dān)心中文亂碼問(wèn)題 res.send('月下風(fēng)起') }) app.get('/heroInfo',(req,res)=>{ res.send({ name:'張三', age:20 }) }) //4.開(kāi)啟服務(wù)器 app.listen(3000,()=>{ console.log('服務(wù)器啟動(dòng)成功') })
4-Express響應(yīng)客戶端數(shù)據(jù)
//1.導(dǎo)入模塊 const express = require('express') //2.創(chuàng)建服務(wù)器 /* express() 相當(dāng)于http模塊的http.createServer() */ const app = express() //3.接收客戶端請(qǐng)求 //文本類型數(shù)據(jù) app.get('/',(req,res)=>{ //響應(yīng)客戶端數(shù)據(jù) res.send('月下風(fēng)起') }) //json格式數(shù)據(jù) app.get('/info',(req,res)=>{ //express自動(dòng)幫我們將js對(duì)象轉(zhuǎn)成json響應(yīng)給客戶端 res.send({ name:'張三', age:20 }) }) //文件類型數(shù)據(jù) app.get('/login',(req,res)=>{ res.sendFile(__dirname + '/login.html') }) //4.開(kāi)啟服務(wù)器 app.listen(3000,()=>{ console.log('服務(wù)器啟動(dòng)成功') })
5.Express托管靜態(tài)資源
http://expressjs.com/en/starter/static-files.html
//1.導(dǎo)入模塊 const express = require('express'); //2.創(chuàng)建服務(wù)器 const app = express() //托管靜態(tài)資源(相當(dāng)于我們之前寫的靜態(tài)資源服務(wù)器) /* 1.當(dāng)請(qǐng)求路徑為/時(shí),express會(huì)自動(dòng)讀取www文件夾中的index.html文件響應(yīng)返回 2.當(dāng)路徑請(qǐng)求為www文件夾中的靜態(tài)資源,express會(huì)自動(dòng)拼接文件路徑并響應(yīng)返回 */ app.use(express.static('www')) //4.開(kāi)啟服務(wù)器 app.listen(3000,()=>{ console.log('success') })
6.第三方中間件使用
-
1.在Express官網(wǎng),有非常多得第三方中間件,它們可以讓我們的Nodejs開(kāi)發(fā)變得極其簡(jiǎn)單
中間件前端的插件,使用后就會(huì)給express中的req或者res添加成員
-
2.所有的第三方框架學(xué)習(xí)套路都是一樣的
- 1.進(jìn)官網(wǎng),查文檔
- 2.CTRL+C 與 CTRL+V
-
3.第三方中間件使用步驟一般都是固定兩步
-
一: 安裝
npm i xxxx
(官網(wǎng)復(fù)制粘貼)- 第三方中間件都需要使用npm安裝,可以理解為是一種特殊的第三方模塊
-
二: 使用
app.use(xxx)
(官網(wǎng)復(fù)制粘貼)
-
-
body-parse第三方中間件:解析post請(qǐng)求參數(shù)
- 安裝body-parser :
npm install body-parser
- https://www.npmjs.com/package/body-parser
- 安裝body-parser :
//導(dǎo)入模塊 const express = require('express') //創(chuàng)建服務(wù)器 const app = express() //使用第三方中間件 /*所有的第三方模塊思路都是一樣 1.進(jìn)官網(wǎng),查文檔 2.找examples(使用示例),復(fù)制粘貼 a.安裝第三方模塊:`npm i body-parser` b.使用中間件: arr.use(具體用法請(qǐng)復(fù)制粘貼) 使用body-parser中間件之后,你的req會(huì)增加一個(gè)body屬性,就是你的post請(qǐng)求參數(shù) */ //(1)導(dǎo)入模塊 const bodyParser = require('body-parser') // parse application/x-www-form-urlencoded //(2)使用中間件 app.use(bodyParser.urlencoded({ extended: false })) //解析json參數(shù) app.use(bodyParser.json()) app.post('/abc',(req,res)=>{ console.log(req.body) //告訴客戶端我收到的參數(shù) res.send(req.body) }) app.post('/efg',(req,res)=>{ console.log(req.body) //告訴客戶端我收到的參數(shù) res.send(req.body) }) //開(kāi)啟服務(wù)器 app.listen(3000, () => { console.log('success'); })