官网

Eggjs 本质上是对 koa 框架的二次封装,所以学习 koa 的中间件就等于学习 Eggjs 的中间件

什么是Koa的中间件

通俗的讲:中间件就是匹配路由之前或者匹配路由完成做的一系列的操作,我们就可以把它叫做中间件。 在express中间件(Middleware) 是一个函数,它可以访问请求对象(request object (req)), 响应对象(response object (res)), 和 web 应用中处理请求-响应循环流程中的中间件,一般被命名为 next 的变量。在Koa中中间件和express有点类似。

中间件的功能包括:

  • 执行任何代码。
  • 修改请求和响应对象。
  • 终结请求-响应循环。
  • 调用堆栈中的下一个中间件。

实际项目中的作用

一句话概括:使用中间件对请求进行连接,增加一些额外的处理

koa 的中间件洋葱模型

image.png
中间件按照顺序从外到内一层层执行,并且每个中间件都会执行两次

egg 中简单上手

app里新建文件夹 middleware

中间件写法

app/middleware/m1.js

  1. 'use strict';
  2. // eslint-disable-next-line no-unused-vars
  3. module.exports = options => {
  4. return async (ctx, next) => {
  5. console.log('m1 start');
  6. await next();
  7. console.log('m1 end');
  8. };
  9. };

这个next 就是继续向下执行的意思
同样搞一个m2,还要去 config.default 配置一下

  1. // add your middleware config here
  2. config.middleware = ['m1', 'm2'];

注意这个数组中是有顺序的


随后刷新主页

控制台:
image.png

手写一个 httpLog 中间件

这个中间件的功能就是 拦截请求并且将请求相关信息输出在一个文件当中

需要对时间进行处理:引入一个第三方依赖包 熟悉的dayjs
yarn add dayjs
以及node自带的文件处理模块 fs
ctx.app.baseDir获取文件路径

  1. 'use strict';
  2. const dayjs = require('dayjs');
  3. const fs = require('fs');
  4. // eslint-disable-next-line no-unused-vars
  5. module.exports = options => {
  6. return async (ctx, next) => {
  7. const sTime = Date.now();
  8. const startTime = dayjs(Date.now()).format(
  9. 'YYYY-MM-DD HH:mm:ss'
  10. );
  11. const req = ctx.request;
  12. await next();
  13. const log = {
  14. method: req.method,
  15. url: req.url,
  16. data: req.body,
  17. startTime,
  18. endTime: dayjs(Date.now()).format('YYYY-MM-DD HH:mm:ss'),
  19. timeLength: Date.now() - sTime,
  20. };
  21. // console.log(log);
  22. const dir = ctx.app.baseDir;
  23. const data =
  24. dayjs(Date.now()).format('YYYY-MM-DD HH:mm:ss') +
  25. ' [httpLog] ' +
  26. JSON.stringify(log) +
  27. '\r\n';
  28. fs.appendFileSync(dir + '/httpLog.log', data);
  29. };
  30. };

配置

config.default.js

  1. config.middleware = ['httpLog'];
  2. // 这里面就是 中间件的参数
  3. config.httpLog = {
  4. type: 'all',
  5. };

config.httpLog 中就是该 httpLog 中间件的的配置参数即 options

效果

image.png
image.png