目录

中间件简介

中间件的执行流程

express中间件的分类

express自定义中间件

express内置中间件

static

接收post提交的数据的中间件

第三方中间件

 

中间件简介

  • 中间件（Middleware），特指业务流程的中间处理环节（处理请求）。
  • 中间件的特点：
  • 1.中间件一般 都要在响应数据之前 执行
  • 2.中间件之间 存在传递关系 上一个中间件执行完之后 传递给下一个中间件。

中间件的执行流程

  • 当一个请求到达Express的服务器之后，可以连续调用多个中间件，从而对这次请求进行预处理。但是必 须要有一个最终的匹配路由进行响应给客户端结果

express中间件的分类

  • 共分为三类
  • 自定义中间件
  • 内置中间件
  • 第三方中间件

express自定义中间件

  • 自定义中间件 就是我们自己编写的 express中间件
  • 写法：服务器对象.use(中间件函数)
  • 中间件的写法 类似于 路由 其实本质上 中间件 就是一种路由的升级
let express = require("express");
let app = express();

//使用自定义中间件
app.use((req,res,next)=>{
    //1.对请求和响应进行一些操作 例如 设置MIME类型
    res.type(".txt")
    //2.将操作流程 传递给下面的中间件/路由 通过next形参 来进行传递
    //next形参接收到的是 一个函数  我们调用这个函数 不需要传参 就可以进行传递了
    next();
})
app.get("/index",(req,res)=>{
    res.send("xxx")
})

app.listen(3000);

express内置中间件

  • 内置中间件都是express 自带的 可以直接使用

static

  • 用法：服务器对象.use(express.static("资源文件夹路径"))

接收post提交的数据的中间件

  • 接收post提交数据 需要用到两个中间件——express.urlencoded 和 express.json
  • 在接收post提交数据的时候 上述两个中间件 都得用
  • 用法：
let express = require("express");
let app = express();
//urlencoded中间件 是用来 接收 post请求的请求头 设置为 content-type:application/x-www-form-urlencoded   提交过来的数据 是 查询字符串
//中间件中 传入的实参对象 就是用来 选择 使用什么工具 来格式化查询字符串的 如果值为true 表示使用express 自带的 qs工具 进行格式化(不推荐)  如果值为false 表示使用node的querystring来格式化(推荐)
app.use(express.urlencoded({extended:false}));
//json中间件 是用来 接收 post请求头 设置为 content-type:application/json 
//提交过来的数据 是 json格式的对象  可以直接使用 不需要格式化 所以不传参
app.use(express.json())

//再之后 我们就可以直接获取到 post提交的数据了   通过 req形参的body属性来获取
app.post("/index",(req,res)=>{
    console.log(req.body);
})

app.listen(3000)

第三方中间件

  • 定义：第三方中间件 就是由 其他人封装好并上传到 npm服务器中的 中间件。 我们如果想使用 只需要到npm上下载并适应即可
  • serve-favicon
  • 之后 大家如果在实际开发中 用到了 npm中的模块包 可以直接在npm官网中 搜索模块包 并查阅其说明文档 来了解模块的用法
  • 看文档的方法
  • 找关键词——install/installation（安装和引入方式） 、API（当前模块提供的操作方法）、usage/example（示例代码）
  • 安装方式
  • npm i serve-favicon
  • 用法
//1.引入express
let express = require("express");
//2.引入中间件
let fav = require("serve-favicon");

let app = express();
//3.使用中间件
app.use(fav("小图标路径",{maxAge:保质期时长（单位为ms）}))
//注意：第二个参数可以不设置 为可选参数
  • serve-favicon 图标 需要强制刷新（ctrl+f5/ctrl+fn+f5）
  • svg-captcha
  • 这个中间件是用来给前端浏览器页面 生成图形验证码的
  • 如果npm打不开（境外服务器） 可以查阅国内的镜像网站——npmmirror 中国镜像站
  • 安装方式
  • npm i svg-captcha
  • 方法1：svg.create()
  • 用法：
//1.引入express
let express = require("express");
//2.引入中间件
let svg = require("svg-captcha");

let app = express();
//3.使用中间件
let code = svg.create({
    size:数字//字符验证码中 字符的个数,
    ignoreChars:"指定的字符集合"//过滤掉的字符 这些字符将不会出现在随机验证码中,
    noise:数字//干扰线条数,
    color:true/false//字体颜色 如果设置为false 默认为灰色 如果设置为true 则还要设置验证码    背景颜色 才能生效
    background:"颜色值" //验证码svg图片的背景色
})
  • 方法2：svg.createMathExpr()
  • 用法：
//1.引入express
let express = require("express");
//2.引入中间件
let svg = require("svg-captcha");

let app = express();
//3.使用中间件
let code = svg.createMathExpr({
	mathMin:数字//数学算式中的随机数数值的下限
    mathMax:数字//数学算式中的随机数数值的上限
    mathOpreator:"+/-/+-"//数学算式的操作符 +- 表示随机加减运算
})