晋升全栈之路 —— express 框架的使用

Express 框架是什么

Express 可以创建各种 Web 应用，可以使用 npm install express 下载。

该框架简化了 Node.js 的网站配置，具有以下特性：

• 提供了方便简洁的路由配置
• 对 HTTP 请求参数进行了简化处理
• 支持模板引擎
• 提供中间件机制
• 可扩展

Express 提供了 get 和 post 方法用来区分 get 和 post 请求。使用 send 方法向客户端响应数据。

中间件

Express 可以接收客户端发送来的数据，可以进行响应，也可以将请求交给下一个中间件进行处理。

中间件可以对客户端发来的请求进行拦截，减少服务器的带宽。

中间件就是一堆方法，例如上面提供了get 和 post 方法，语法结构如下：

app.get('/', (req, res, next)=>{})
app.post('/', (req, res, next)=>{})

上述语法结构中如果调用了回调函数中的 next() 方法，表示将本次请求交给下一个中间件进行处理。
如下代码所示：

const express = require('express')
const app = express()
const port = 3000

app.get('/', (req, res, next) => {
   
    req.str = '这是第一个中间件设置的变量';
    next()
})

app.get('/', (req, res) => {
   
    res.send(req.str)
})
app.listen(port, () => console.log(`Example app listening on port port!`))

浏览器地址栏中输入 localhost:3000 页面显示如下：

这是第一个中间件设置的变量

use 方法

express 对象的 get 和 post 方法分别接收 get 和 post 请求，如果想要接收所有的请求方式需要使用 use 方法。

use 方法可以直接传入一个回调函数，将匹配所有请求路径上的任何请求。也可以将第一个参数设置为请求地址，将匹配该地址上的所有请求。
如下代码所示：

const express = require('express')
const app = express()
const port = 3000

// 匹配该网站所有的请求
app.use((req ,res, next)=>{
   
    // 当访问 localhost:3000 会执行 log
    console.log('this is use function.');
    // 继续向下匹配
    next()
})
app.use('/index', (req,res,next)=>{
   
    console.log('this is index page.');
    next();
})

app.get('/', (req, res) => {
   
    // 响应 hello world
    res.send('Hello World!')
})

app.listen(port, () => console.log(`Example app listening on port port!`))

在浏览器地址栏中输入，localhost:3000，终端结果：

this is use function.

在浏览器地址栏中输入，localhost:3000/index，终端结果：

this is use function.
this is index page.

应用

中间件可以用来做路由保护，当用户访问页面时，可以使用中间件判断用户的登陆，如果用户登陆了才调用 next() 方法；如果没有登陆则拦截请求，直接向客户端返回数据。
如下代码所示：

const express = require('express')
const app = express()
const port = 3000

// 用户是否登陆
let flag = true

app.use((req,res,next)=>{
   
    if (flag) {
   
        next();
    }
    res.send('请登录')
})

app.get('/', (req, res) =&