express中间件（简介，流程，分类介绍）

目录

中间件简介

中间件的执行流程

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:"+/-/+-"//数学算式的操作符 +- 表示随机加减运算
      })