聊一聊koa
目标
本文主要通过一个简单的例子来解释koa的内部原理。
koa的一个简单例子
const Koa = require('koa'); const app = new Koa(); app.use(async ctx => { ctx.body = 'Hello World'; }); app.listen(3000);
koa内部文件组成
- application.js中包含了Application类和一些辅助方法
- context.js主要作用是承载上下信息,并封装了处理上下文信息的操作
- request.js中封装了处理请求信息的基本操作
- response.js中封装了处理响应信息的基本操作
koa内部
在文章开头的例子中,执行const app = new koa()时,实际上构造了一个Application实例,在application的构造方法中,创建了context.js、request.js、response.js代码的运行实例。下文约定request值request.js代码运行实例,response指response.js运行实例,context指context.js运行实例。
constructor() { super(); this.proxy = false; this.middleware = []; this.subdomainOffset = 2; this.env = process.env.NODE_ENV || 'development'; this.context = Object.create(context); this.request = Object.create(request); this.response = Object.create(response); if (util.inspect.custom) { this[util.inspect.custom] = this.inspect; } }
调用app.listen(3000)方法监听3000端口的http请求,listen方法内部创建了一个http.Server对象,并调用http.Server的listen方法。具体代码如下:
listen(...args) { debug('listen'); const server = http.createServer(this.callback()); return server.listen(...args); }
其中this.callback方法的源码如下:
callback() { const fn = compose(this.middleware); if (!this.listenerCount('error')) this.on('error', this.onerror); const handleRequest = (req, res) => { const ctx = this.createContext(req, res); return this.handleRequest(ctx, fn); }; return handleRequest; }
该方法返回一个handleRequest函数,作为createServer的参数,当http.Server实例接收到一个http请求时,会将请求信息和请求响应对象传给handleRequest函数,具体指将http.IncomingMessage的实例req,和http.ServerResponse的实例res传给handleRequest方法。其中this.createContext函数的源码如下:
createContext(req, res) { const context = Object.create(this.context); const request = context.request = Object.create(this.request); const response = context.response = Object.create(this.response); context.app = request.app = response.app = this; context.req = request.req = response.req = req; context.res = request.res = response.res = res; request.ctx = response.ctx = context; request.response = response; response.request = request; context.originalUrl = request.originalUrl = req.url; context.state = {}; return context; }
上面代码的主要作用是将请求信息和响应信息封装在request.js和response.js的运行实例中,并创建上下文对象context,context包含了application实例、request实例、response实例的引用。在this.callback方法中还有另一行很重要的代码:
const fn = compose(this.middleware);
可以从Application的构造方法知道this.middleware是一个数组,该数组用来存储app.use方法传入的中间件方法。Application的use方法具体代码实现细节如下,其中最关键的一行代码是this.middleware.push(fn)。
use(fn) { if (typeof fn !== 'function') throw new TypeError('middleware must be a function!'); if (isGeneratorFunction(fn)) { deprecate('Support for generators will be removed in v3. ' + 'See the documentation for examples of how to convert old middleware ' + 'https://github.com/koajs/koa/blob/master/docs/migration.md'); fn = convert(fn); } debug('use %s', fn._name || fn.name || '-'); this.middleware.push(fn); return this; }
compose方法的实现包含在koa-compose包中,具体代码实现细节如下:
function compose (middleware) { if (!Array.isArray(middleware)) throw new TypeError('Middleware stack must be an array!') for (const fn of middleware) { if (typeof fn !== 'function') throw new TypeError('Middleware must be composed of functions!') } return function (context, next) { // last called middleware # let index = -1 return dispatch(0) function dispatch (i) { if (i <= index) return Promise.reject(new Error('next() called multiple times')) index = i let fn = middleware[i] if (i === middleware.length) fn = next if (!fn) return Promise.resolve() try { return Promise.resolve(fn(context, dispatch.bind(null, i + 1))); } catch (err) { return Promise.reject(err) } } } }
compose方法接收this.middleware数组,返回一个匿名函数,该函数接收两个参数,上下文实例context和一个next函数,执行该匿名函数会执行this.middleware数组中的所有中间件函数,然后在执行传入的next函数。在Application的callback方法的最后将执行上下文对象和compose方法返回的匿名函数作为参数调用this.handleRequest方法。接下来看一下this.handleRequest方法的具体细节:
handleRequest(ctx, fnMiddleware) { const res = ctx.res; res.statusCode = 404; const onerror = err => ctx.onerror(err); const handleResponse = () => respond(ctx); onFinished(res, onerror); return fnMiddleware(ctx).then(handleResponse).catch(onerror); }
在this.handleRequest方法中创建了错误处理方法onError和返回响应的方法handleResponse。
fnMiddleware就是compose方法返回的匿名函数。在this.handleRequest方法的最后执行匿名函数,并传入hanldeResponse和onError函数分别处理正常请求响应流程和异常情况。
return fnMiddleware(ctx).then(handleResponse).catch(onerror);
执行fnMiddleware函数,实际上是执行之前传入所有中间件函数。在中间函数中可以拿到上下文对象的引用,通过上下文对象我们可以获取到经过封装的请求和响应实例,具体形式如下:
app.use(async ctx => { ctx; // 这是 Context ctx.request; // 这是 koa Request ctx.response; // 这是 koa Response });
在中间件方法中可以设置响应头信息、响应内容。以及读取数据库,获取html模版等。将需要返回给用户端的数据赋值给上下文对象context的body属性。respond方法的具体实现如下:
function respond(ctx) { // allow bypassing koa if (false === ctx.respond) return; if (!ctx.writable) return; const res = ctx.res; let body = ctx.body; const code = ctx.status; // ignore body if (statuses.empty[code]) { // strip headers ctx.body = null; return res.end(); } if ('HEAD' == ctx.method) { if (!res.headersSent && isJSON(body)) { ctx.length = Buffer.byteLength(JSON.stringify(body)); } return res.end(); } // status body if (null == body) { if (ctx.req.httpVersionMajor >= 2) { body = String(code); } else { body = ctx.message || String(code); } if (!res.headersSent) { ctx.type = 'text'; ctx.length = Buffer.byteLength(body); } return res.end(body); } // responses if (Buffer.isBuffer(body)) return res.end(body); if ('string' == typeof body) return res.end(body); if (body instanceof Stream) return body.pipe(res); // body: json body = JSON.stringify(body); if (!res.headersSent) { ctx.length = Buffer.byteLength(body); } res.end(body); }
respond方法的主要作用是对返回的内容进行一些处理,然后调用node.js的http.ServerResponse实例的end方法,将具体内容返回给用户端。
request.js和response.js
在Application的createContext方法中,将node.js的请求(http.IncomingMessage)和响应对象(http.ServerResponse)分别赋值给了request.js和response.js文件代码实例对象。
request.js中主要包含了处理请求的方法(实际上都是get方法,或者获取器),获取请求数据,例如:
get host() { const proxy = this.app.proxy; let host = proxy && this.get('X-Forwarded-Host'); if (!host) { if (this.req.httpVersionMajor >= 2) host = this.get(':authority'); if (!host) host = this.get('Host'); } if (!host) return ''; return host.split(/\s*,\s*/, 1)[0]; },
上面的代码中this.req是http.IncomingMessage实例,包含了http请求信息。
response.js中包含了处理请求响应的操作。例如设置响应状态:
set status(code) { if (this.headerSent) return; assert(Number.isInteger(code), 'status code must be a number'); assert(code >= 100 && code <= 999, `invalid status code: ${code}`); this._explicitStatus = true; this.res.statusCode = code; if (this.req.httpVersionMajor < 2) this.res.statusMessage = statuses[code]; if (this.body && statuses.empty[code]) this.body = null; }
this.res指http.ServerResponse对象实例
结尾
~~~~~