从零实现TypeScript版Koa

这篇文章会讲些什么？

• 如何从零开始完成一个涵盖Koa核心功能的Node.js类库
• 从代码层面解释Koa一些代码写法的原因：如中间件为什么必须调用next函数、ctx是怎么来的和一个请求是什么关系

我们知道Koa类库主要有以下几个重要特性：

• 支持洋葱圈模型的中间件机制
• 封装request、response提供context对象，方便http操作
• 异步函数、中间件的错误处理机制

第一步：基础Server运行

目标：完成基础可行新的Koa Server

• 支持app.listen监听端口启动Server
• 支持app.use添加类middleware处理函数

核心代码如下：

class Koa {
   
  private middleware: middlewareFn = () => {
   };
  constructor() {
   }
  listen(port: number, cb: noop) {
   
    const server = http.createServer((req, res) => {
   
      this.middleware(req, res);
    });
    return server.listen(port, cb);
  }
  use(middlewareFn: middlewareFn) {
   
    this.middleware = middlewareFn;
    return this;
  }
}

const app = new Koa();
app.use((req, res) => {
   
  res.writeHead(200);
  res.end("A request come in");
});
app.listen(3000, () => {
   
  console.log("Server listen on port 3000");
});

第二步：洋葱圈中间件机制实现

目标：接下来我们要完善listen和use方法，实现洋葱圈中间件模型

[外链图片转存失败(img-qYztqNsK-1568619865571)(./assets/koa_middleware.png)]

如下面代码所示，在这一步中我们希望app.use能够支持添加多个中间件，并且中间件是按照洋葱圈(类似深度递归调用)的方式顺序执行

app.use(async (req, res, next) => {
   
  console.log("middleware 1 start");
  // 具体原因我们会在下面代码实现详细讲解
  await next();
  console.log("middleware 1 end");
});
app.use(async (req, res, next) => {
   
  console.log("middleware 2 start"