学习 koa 源码的整体架构，浅析koa洋葱模型原理和co原理

1. 创建一个跟踪响应时间的日期

2. 等待下一个中间件的控制

3. 创建另一个日期跟踪持续时间

4. 等待下一个中间件的控制

5. 将响应主体设置为“Hello World”

6. 计算持续时间

7. 输出日志行

8. 计算响应时间

9. 设置 X-Response-Time 头字段

10. 交给 Koa 处理响应

读者们看完这个gif图，也可以思考下如何实现的。根据表现，可以猜测是next是一个函数，而且返回的可能是一个promise，被await调用。

看到这个gif图，我把之前写的examples/koa-compose的调试方法含泪删除了。默默写上gif图上的这些代码，想着这个读者们更容易读懂。我把这段代码写在这里 koa/examples/middleware/app.js便于调试。

在项目路径下配置新建.vscode/launch.json文件，program配置为自己写的koa/examples/middleware/app.js文件。

.vscode/launch.json 代码，点击这里展开/收缩，可以复制

按F5键开始调试，调试时先走主流程，必要的地方打上断点，不用一开始就关心细枝末节。

断点调试要领：

赋值语句可以一步跳过，看返回值即可，后续详细再看。

函数执行需要断点跟着看，也可以结合注释和上下文倒推这个函数做了什么。

上述比较啰嗦的写了一堆调试方法。主要是想着授人予鱼不如授人予渔，这样换成其他源码也会调试了。

简单说下chrome调试nodejs，chrome浏览器打开chrome://inspect，点击配置**configure…**配置127.0.0.1:端口号(端口号在Vscode 调试控制台显示了)。

更多可以查看English Debugging Guide

中文调试指南

喜欢看视频的读者也可以看慕课网这个视频node.js调试入门，讲得还是比较详细的。

不过我感觉在chrome调试nodejs项目体验不是很好（可能是我方式不对），所以我大部分具体的代码时都放在html文件script形式，在chrome调试了。

先看看 new Koa() 结果app是什么

---

看源码我习惯性看它的实例对象结构，一般所有属性和方法都放在实例对象上了，而且会通过原型链查找形式查找最顶端的属性和方法。

用koa/examples/middleware/app.js文件调试时，先看下执行new Koa()之后，app是什么，有个初步印象。

// 文件 koa/examples/middleware/app.js

const Koa = require(‘…/…/lib/application’);

// const Koa = require(‘koa’);

// 这里打个断点

const app = new Koa();

// x-response-time

// 这里打个断点

app.use(async (ctx, next) => {

});

在调试控制台ctrl + 反引号键（一般在Tab上方的按键）唤起，输入app，按enter键打印app。会有一张这样的图。

koa 实例对象调试图

VScode也有一个代码调试神器插件Debug Visualizer。

安装好后插件后，按ctrl + shift + p，输入Open a new Debug Visualizer View，来使用，输入app，显示是这样的。

koa 实例对象可视化简版

不过目前体验来看，相对还比较鸡肋，只能显示一级，而且只能显示对象，相信以后会更好。更多玩法可以查看它的文档。

我把koa实例对象比较完整的用xmind画出来了，大概看看就好，有个初步印象。