简单中间件模型

中间件是软件开发过程中架构的一个通用概念,其目的在于为运行的主程序提供一个供外部自定义拓展的能力。比如:wen服务的controller层中间件针对request请求处理的前后进行通用的扩展处理、redux中间件针对store数据获取前后的扩展处理。。。

本文简单介绍一种中间件调用机制的模型,可以基于此应用到很多场景:

模型设计实现

基于洋葱模型,可以注册多个中间件,中间件函数可以执行任何必要的预处理或后处理动作,并通过调用next()来让控制权流转至下一个中间件。

复制代码
class App {
  constructor(middleware) {
    this.middleware = middleware || [];
  }

  cursor = 0;

  use(fn) {
    this.middleware.push(fn);
  }

  async run(data) {
    const fn = this.middleware[this.cursor++];
    if (fn) {
      return fn(data, (d) => this.run(d));
    }
  }
}

模型使用

复制代码
/**
 * 模拟异步情况
 * @param {*} s
 * @returns
 */
const wait = async (s) => {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve();
    }, s);
  });
};

/**
 * 初始化中间件
 */
const m = new App([
  async (data, next) => {
    console.log("a-before", data);
    await wait(1000);
    const res = await next(data + "a");
    console.log("a-after", res);
    return res + "a";
  },
  async (data, next) => {
    console.log("b-before", data);
    await wait(1000);
    const res = await next(data + "b");
    console.log("b-after", res);
    return res + "b";
  },
]);

/**
 * 注册中间件
 */
m.use(async (data, next) => {
  console.log("c-before", data);
  await next(data + "c");
  await wait(1000);
  console.log("c-after", 2);
  return 2 + "c";
});
m.run(1);
相关推荐
liberty8884 分钟前
dppt如何找到弹框
java·服务器·前端
宁雨桥6 分钟前
使用pnpm构建高效Monorepo:从零到一的完整指南
前端·pnpm·项目架构
chéng ௹9 分钟前
uniapp vue3 unipush2.0 调用系统通知功能流程
前端·vue.js·uni-app
一字白首10 分钟前
Node.js 入门,进阶核心:CommonJS+ES6 模块化、包、Express 与跨域
node.js·es6·express
小菜今天没吃饱12 分钟前
DVWA-XSS(DOM)
前端·javascript·xss·dvwa
q***046313 分钟前
Spring Cloud Alibaba 组件版本选择
android·前端·后端
李少兄14 分钟前
解决 `npm install` 卡在 `idealTree: sill idealTree buildDeps` 的排查与修复
前端·npm·node.js
毕设十刻16 分钟前
基于Vue的企业管理系统pk6uy(程序 + 源码 + 数据库 + 调试部署 + 开发环境配置),配套论文文档字数达万字以上,文末可获取,系统界面展示置于文末
前端·数据库·vue.js
276695829217 分钟前
雷池waf 逆向
java·开发语言·前端·python·wasm·waf·雷池waf
w***488219 分钟前
解决报错net.sf.jsqlparser.statement.select.SelectBody
android·前端·后端