nodejs 发展很快,从 npm 上面的包托管数量就可以看出来。不过从另一方面来看,也是反映了 nodejs 的基础不稳固,需要开发者创造大量的轮子来解决现实的问题。
知其然,并知其所以然这是程序员的天性。所以把常用的模块拿出来看看,看看高手怎么写的,学习其想法,让自己的技术能更近一步。
引言
express 是 nodejs 中最流行的 web 框架。express 中对 http 中的 request 和 response 的处理,还有以中间件为核心的处理流程,非常灵活,足以应对任何业务的需求。
而 connect 曾经是 express 3.x 之前的核心,而 express 4.x 已经把 connect 移除,在 express 中自己实现了 connect 的接口。可以说 connect 造就了 express 的灵活性。
因此,我很好奇,connect 是怎么写的。
争取把每一行代码都弄懂。
connect 解析
我们要先从 connect 的官方例子开始
var connect = require( 'connect' ); var http = require( 'http' ); var app = connect(); // gzip/deflate outgoing responses var compression = require( 'compression' ); app.use(compression()); // store session state in browser cookie var cookieSession = require( 'cookie-session' ); app.use(cookieSession({ keys: [ 'secret1' , 'secret2' ] })); // parse urlencoded request bodies into req.body var bodyParser = require( 'body-parser' ); app.use(bodyParser.urlencoded({extended: false })); // respond to all requests app.use( function (req, res){ res.end( 'Hello from Connect!\n' ); }); //create node.js http server and listen on port http.createServer(app).listen(3000);
从示例中可以看到一个典型的 connect 的使用:
var app = connect() // 初始化 app.use( function (req, res, next) { // do something }) // http 服务器,使用 http.createServer(app).listen(3000);
先倒着看,从调用的地方更能看出来,模块怎么使用的。我们就先从 http.createServer(app) 来看看。
从 的官方文档中可以知, createServer 函数的参数是一个回调函数,这个回调函数是用来响应 request 事件的。从这里看出,示例代码中 app 中函数签就是 (req, res) ,也就是说 app 的接口为 function (req, res) 。
但是从示例代码中,我们也可以看出 app 还有一个 use 方法。是不是觉得很奇怪,js 中函数实例上,还以带方法,这在 js 中就叫 函数对象,不仅能调用,还可以带实例变量。给个例子可以看得更清楚:
function handle () { function app(req, res, next) { app.handle(req, res, next)} app.handle = function (req, res, next) { console.log( this ); } app.statck = []; return app; } var app = handle(); app() // ==> { [Function: app] handle: [Function], stack: [] } app.apply({}) // ==>{ [Function: app] handle: [Function], stack: [] }
可以看出:函数中的实例函数中的 this 就是指当前的实例,不会因为你使用 apply 进行环境改变。
其他就跟对象没有什么区别。
再次回到示例代码,因该可以看懂了, connect 方法返回了一个函数,这个函数能直接调用,有 use 方法,用来响应 http 的 request 事件。
到此为此,示例代码就讲完了。 我们开始进入到 connect 模块的内部。
connect 只有一个导出方法。就是如下:
var merge = require( 'utils-merge' ); module.exports = createServer; var proto = {}; function createServer() { // 函数对象,这个对象能调用,能加属性 function app(req, res, next){ app.handle(req, res, next); } merge(app, proto); // ===等于调用 Object.assign merge(app, EventEmitter.prototype); // === 等于调用 Object.assign app.route = 'https://www.jb51.net/' ; app.stack = []; return app; }
从代码中可以看出,createServer 函数把 app 函数返回了,app 函数有三个参数,多了一个 next (这个后面讲),app函数把 proto 的方法合并了。还有 EventEmitter 的方法也合并了,还增加了 route 和 stack 的属性。
从前面代码来看,响应 request 的事件的函数,是 app.handle 方法。这个方法如下:
proto.handle = function handle(req, res, out) { var index = 0; var protohost = getProtohost(req.url) || '' ; //获得 var removed = '' ; var slashAdded = false ; var stack = this .stack; // final function handler var done = out || finalhandler(req, res, { env: env, onerror: logerror }); // 接口 done(err); // store the original URL req.originalUrl = req.originalUrl || req.url; function next(err) { if (slashAdded) { req.url = req.url.substr(1); // 除掉 / 之后的字符串 slashAdded = false ; // 已经拿掉 } if (removed.length !== 0) { req.url = protohost + removed + req.url.substr(protohost.length); removed = '' ; } // next callback var layer = stack[index++]; // all done if (!layer) { defer(done, err); // 没有中间件,调用 finalhandler 进行处理,如果 err 有值,就返回 404 进行处理 return ; } // route data var path = parseUrl(req).pathname || 'https://www.jb51.net/' ; var route = layer.route; // skip this layer if the route doesn't match if (path.toLowerCase().substr(0, route.length) !== route.toLowerCase()) { return next(err); // 执行下一个 } // skip if route match does not border "https://www.jb51.net/", ".", or end var c = path[route.length]; if (c !== undefined && '/ ' !== c && ' . ' !== c) { return next(err); // 执行下一个 } // trim off the part of the url that matches the route if (route.length !== 0 && route !== ' / ') { removed = route; req.url = protohost + req.url.substr(protohost.length + removed.length); // ensure leading slash if (!protohost && req.url[0] !== ' / ') { req.url = ' /' + req.url; slashAdded = true ; } } // call the layer handle call(layer.handle, route, err, req, res, next); } next(); };
代码中有相应的注释,可以看出,next 方法就是一个递归调用,不断的对比 route 是否匹配,如果匹配则调用 handle, 如果不匹配,则调用下一个 handle.
call 函数的代码如下: