文章目录
- 🌟前言
- 🌟中间件
- 🌟中间件函数
- 🌟什么是中间件函数
- 🌟中间件函数可以做什么
- 🌟Express中间件的类型
- 🌟应用级中间件
- 🌟路由器级中间件
- 🌟错误处理中间件
- 🌟内置中间件
- 🌟静态资源托管 express.static 中间件
- 🌟第三方中间件
- 🌟cookie-parser
- 🌟express-session
- 🌟Express应用生成器
- 🌟安装应用生成器
- 🌟基本使用
- 🌟目录结构
- 🌟写在最后
🌟前言
哈喽小伙伴们,新的专栏 Node 已开启;这个专栏里边会收录一些Node的基础知识和项目实战;今天我们开始这个专栏的第七篇文章,带领大家初识一下 Express框架
;让我们一起来看看吧🤘
🌟中间件
Express 是一个路由和中间件组成的Web框架。
中间件是排列到管道中的处理程序,用于处理请求和响应。
🌟中间件函数
🌟什么是中间件函数
Express 应用程序本质上是一系列中间件函数调用。
中间件函数是可以访问请求对象 (req)、响应对象(res) 和next应用程序请求-响应周期中的函数的函数。该next函数是 Express 路由器中的一个函数,当被调用时,它会在当前中间件之后执行中间件。
function (req, res, next) {
// 通过req操作请求对象
// 通过res操作响应对象
next() // 调用next()函数,可以调用下一个中间件
}
🌟中间件函数可以做什么
中间件函数可以执行以下任务:
- 执行任何代码。
- 更改请求和响应对象。
- 结束请求-响应周期。
- 调用堆栈中的下一个中间件。
中间件就是处理HTTP请求的函数,用来完成各种特定的任务,比如:
- 检查用户是否登录
- 添加公共方法。
🌟Express中间件的类型
如果当前中间件函数没有结束请求-响应循环,它必须调用
next()
以将控制权传递给下一个中间件函数。否则,请求将被挂起。
Express 应用程序可以使用以下类型的中间件:
- 应用级中间件
- 路由器级中间件
- 错误处理中间件
- 内置中间件
- 第三方中间件
🌟应用级中间件
在Express程序中,使用 app.use()
和 app.METHOD()
方法将中间件绑定到应用程序对象(app)。
在 Express 程序中,通过调用 app.use()
向管道中插入中间件。
var express = require('express')
var app = express()
app.use(function (req, res, next) {
console.log('Time:', Date.now())
next()
})
在 Express 程序中,通过调用 app.METHOD(PATH,MiddleWare,…,HANDLER) 向管道中插入中间件。
app.get('/user', function (req, res, next) {
console.log('Request URL:', req.originalUrl)
next()
}, function (req, res, next) {
res.send('USER')
})
🌟路由器级中间件
**路由器级中间件的工作方式与应用级中间件相同,只是它绑定到
express.Router()
**
var router = express.Router()
使用router.use()和router.METHOD()函数绑定路由器级中间件。
var express = require('express')
var app = express()
var router = express.Router()
router.use(function (req, res, next) {
console.log('Time:', Date.now())
next()
})
router.get('/user/:id', function (req, res, next) {
console.log('Request URL:', req.originalUrl)
next()
}, function (req, res, next) {
console.log('Request Type:', req.method)
next()
})
🌟错误处理中间件
与其他中间件函数相同的方式定义错误处理中间件函数,但是使用四个参数(
err
,req
,res
,next
):
app.use(function (err, req, res, next) {
console.error(err.stack)
res.status(500).send('Something broke!')
})
🌟内置中间件
Express 具有以下内置中间件功能:
- express.static提供静态资源,例如 HTML 文件、图像等。
- express.json使用 JSON 有效负载解析传入请求。注意:可用于 Express 4.16.0+
- express.urlencoded解析带有 URL 编码负载的传入请求。 注意:可用于 Express 4.16.0+
🌟静态资源托管 express.static 中间件
express.static 是 Express 内置的一个中间件,负责托管 Express 应用内的静态资源。如果要在网页中加载静态文件(css、js、img),就需要另外指定一个存放静态文件的目录
- 项目目录下添加一个存放静态文件的目录为 public
- 在public目录下在添加三个存放 js 、 css 、 img 的目录,把相关文件放到相应的目录下
- 当浏览器发出文件请求时,服务器端就会到这个目录下去寻找相关文件
app.use(express.static(require('path').join(__dirname, 'public')));
🌟第三方中间件
🌟cookie-parser
npm install --save cookie-parser
app.use(require(cookie-parser)(秘钥放在这里);)
提供对 cookie 的支持。
🌟express-session
npm install --save express-session
app.use(require(express-session)());)
提供会话 ID(存在 cookie 里)的会话支持。默认存在内存里,不适用于生产环境,并且可以配置为使用数据库存储。
🌟Express应用生成器
通过应用生成器工具 express-generator 可以快速创建一个应用的骨架。
🌟安装应用生成器
你可以通过 npx (包含在 Node.js 8.2.0 及更高版本中)命令来运行 Express 应用程序生成器(无需安装)。
$ npx express-generator
对于较老的 Node 版本,请通过 npm 将 Express 应用程序生成器安装到全局环境中并使用:
$ npm install express-generator -g
-h 选项可以列出所有可用的命令行选项:
$ express -h
Usage: express [options] [dir]
Options:
--version output the version number
-e, --ejs add ejs engine support
--pug add pug engine support
--hbs add handlebars engine support
-H, --hogan add hogan.js engine support
-v, --view <engine> add view <engine> support (dust|ejs|hbs|hjs|jade|pug|twig|vash) (defaults to jade)
--no-view use static html instead of view engine
-c, --css <engine> add stylesheet <engine> support (less|stylus|compass|sass) (defaults to plain css)
--git add .gitignore
-f, --force force on non-empty directory
-h, --help output usage information
🌟基本使用
例如,如下命令创建了一个名称为 myapp 的 Express 应用。此应用将在当前目录下的 myapp 目录中创建,并且设置为使用 ejs 模板引擎(view engine):
$ express --view=ejs myapp
**或者简写**
$ express -e myapp
warning: option `--ejs' has been renamed to `--view=ejs'
create : myapp/
create : myapp/public/
create : myapp/public/javascripts/
create : myapp/public/images/
create : myapp/public/stylesheets/
create : myapp/public/stylesheets/style.css
create : myapp/routes/
create : myapp/routes/index.js
create : myapp/routes/users.js
create : myapp/views/
create : myapp/views/error.ejs
create : myapp/views/index.ejs
create : myapp/app.js
create : myapp/package.json
create : myapp/bin/
create : myapp/bin/www
change directory:
$ cd myapp
install dependencies:
$ npm install
run the app:
$ DEBUG=myapp:* npm start
然后安装所有依赖包:
$ cd myapp
$ npm install
启动这个应用(MacOS 或 Linux 平台):
$ DEBUG=myapp:* npm start
Windows 平台使用如下命令:
set DEBUG=myapp:* & npm start
然后在浏览器中打开 http://localhost:3000/ 网址就可以看到这个应用了。
🌟目录结构
/
├── app.js 入口文件
│
├── bin
│ └── www
│
├── views # 存放视图文件 如jade,ejs,html等
│ ├── admin # 后台视图文件
│ │ ├── login.html
│ │ └── reg.html
│ └── index # 前台视图文件
│ ├── index.html
│ ├── header.html
│ └── footer.html
│
├── controllers/ # 控制器文件
│
├── models/ # 模型文件
│
├── routes # 存放路由文件
│ ├── index.js
│ └── user.js
│
├── public # 存放image , css , js 等静态文件
│ ├── images/
│ ├── css/
│ └── js/
│
├── node_modules # 存放npm包
│
└── package.json # npm包配置文件,工程信息以及模块依赖
🌟写在最后
更多Node知识以及API请大家持续关注,尽请期待。各位小伙伴让我们 let’s be prepared at all times!
✨原创不易,还希望各位大佬支持一下!
👍 点赞,你的认可是我创作的动力!
⭐️ 收藏,你的青睐是我努力的方向!
✏️ 评论,你的意见是我进步的财富!