不久前看到朋友在说关于nodejs的东西,我说,这东西不是哑火了吗?对方说,怎么可能,火得很。于是有了点兴趣,想说没事瞎折腾一番。找了一个网站:http://www.nodebeginner.org/index-zh-cn.html 专门介绍nodejs入门,翻译得也不错。一个下午看完,照着写了一个服务器。感觉这是最最入门的部分,所以我的叙述以此为起点:假定我们已经创建了这么几个文件:index.js, server.js, router.js, requestHandlers.js.
照着教程写完之后发现写出来的东西太过基础,存在很多问题,所以昨天趁着有空,自己试着改写一番。
一,原代码中,直接在requestHandlers 中写html代码并传给response,这很不科学。不过解决方法其实很简单,nodejs有文件读取的模块,在文件开头引入:var fs = require("fs"); 即可。之后可以这样写:
requestHandlers.js:
var fs = require("fs");
...
function start(response, request) {
fs.readFile("./html/start.html", function(err, data){
if(err){
throw err;
}
response.writeHead(200, {"Content-Type": "text/html"});
response.write(data);
response.end();
});
}
这样一来就使得MVC分离有了可能,让handler只处理用户请求并制定渲染那个页面,最终将这个页面呈现给用户。所以有了第二个问题。
二,应该由router来处理页面输出。handler只处理用户请求然后决定输出哪个页面,具体页面输出操作由router(或者更底层的部分)来完成。大概的代码变成下面这样:
function start(response, request) {
router.render('start', request, response);
}
render函数中输入文件名,以及request和response。render函数负责在指定的文件夹下面查找指定文件名的文件,处理并输出。这里的文件名不加后缀是因为不确定页面渲染要不要用其他框架,要用什么框架,不同框架使用的后缀名可能不同,所以干脆在这里仅指定名字,后缀名由router函数添加。
昨晚对这个render函数纠结了很久,不知道为什么总觉得传入的参数太多了。大概是受了之前看过的play framework的影响吧,人家的render函数就只是render() 这样就好了。后来还是放弃了,以后想到再来改写吧。
三,如何配置路由?根据这份指南,写出来的路由配置是这样的:
index.js:
var handle = {};
handle["/"] = requestHandlers.start;
handle["/start"] = requestHandlers.start;
handle["/upload"] = requestHandlers.upload;
handle["/show"] = requestHandlers.show;
配置完成之后将handle传给server:server.start(router.route, handle);
这么一来,开发者想要拓展的话,必须打开index.js 文件,在其中添加自己的handler,而且还没办法指定不同http方法(get, post等)对应不同的handler。所以路由的实现要重新写。要求开发者自己创建一个application.js 文件,在其中写自己的路由配置, 大致代码类似于:
application.js:
var Router = require("./router").Router;
var router = new Router();
router.get('/start', function(request, response) {
router.render('start', request, response);
});
exports.applicationRouter = router;
其中文件开头与结尾部分都是固定的,开发者需要填补中间的空白,调用如router.get() 等函数,设置handler。
四,Router怎么实现。首先想一下server怎么使用路由。改写了index.js,index.js会加载用户定义的application.js文件,执行完application.js 之后,相当于router已经设置完成,之后传给server:
index.js:
var server = require("./server");
var applicationRouter = require("./application").applicationRouter;
if(!applicationRouter){
console.log('Can not find controler, exit!');
return;
}
server.start(applicationRouter);
其中,applicationRouter 在application.js 中:exports.applicationRouter = router;
在server中,每次获取到一个请求的时候,提取其HTTP method,并解析path,之后传给router处理:
server.js:
function start(router){
console.log("set router: " + router.route);
http.createServer(function(request, response){
var path = url.parse(request.url).pathname;
var method = request.method;
console.log("get request: " + path);
router.handle(method, path, request, response);
}).listen(8080);
console.log("server has been started.");
}
接下来的工作交给router.handler()函数了,router.handler() 函数应该根据method,path 来确定调用哪个action,action在application.js 中已经由开发者定义。所以router中应该有保存这些action 函数的地方,handler在其中找到适合的函数并调用。
五,router的内部实现。
1. 保存action函数的地方:
function Router(){
console.log("create router");
this.route = {
'GET': {},
'POST': {},
'PUT': {},
'DELETE': {},
'HEAD': {}
};
...
}
配合设置action函数的函数来看:
this.setRoute = function(requestKind, path, handler){
if(typeof(handler) === 'function'){
this.route[requestKind][path] = handler;
console.log("set handler: " + this.route);
}else{
console.log("wrong handler for " + requestKind + ": " + path);
}
}
看上面加粗的部分,应该就能明了。
router提供方法用于设置特定HTTP method对应的action,以get方法为例:
this.get = function(path, handler){
this.setRoute('GET', path, handler);
}
调用者可以简单地使用router.get("/path", function(){}) 来设置action。
以上是准备部分。接下来是handle函数。handler需要根据传入的参数判断调用哪个action方法,代码如下:
this.handle = function(HTTPMethod, path, request, response){
HTTPMethod = HTTPMethod.toUpperCase();
console.log("handle: method=" + HTTPMethod + "; path=" + path);
var handler = this.route[HTTPMethod][path];
if(typeof(handler) === 'function'){
handler(request, response);
}else{
console.log('path:' + path + " not found.")
this.notFound(request, response);
}
}
关键部分已加粗,即直接根据method与path找到已经注册的action,如果没有,则返回404页面。这是最简陋的实现方法,路径不能使用通配符。这部分等这个周末再来想想怎么做吧。
最后是router提供的render部分。由action函数调用,获取html页面并返回给服务器,服务器返回给用户。代码如下:
this.render = function(path, request, response){
fs.readFile('./html/' + path + '.html', function(err, data){
if(err){
throw err;
}
response.writeHead(200, {"Content-Type": "text/html"});
response.write(data);
response.end();
});
}
目前只能直接输出html页面,将来可以使用其他框架生成动态页面,那么获取函数签名需要改一改:由action函数提取参数传给render,render函数将参数传给模板。如果使用这样的方式,使用动态页面,那么是否需要在另外的地方进行参数的提取与封装?周末再考虑。
至此,一个简单的nodejs web应用完成,并为接下来的升级留下了空间,除了比较纠结的render()之外。
一个请求流程如下:request-> server-> router.handle-> action function-> router.render()-> response.end() (触发事件使server返回response).
事实上,我对web框架的一些高级概念很生疏,什么控制反转啊,注入啊,完全不明白。只是觉得开发一套简单(对开发者来说)的框架是一件很有意义的事情,所以会一直想要自己开发框架啊。至于JS, nodejs,都是初学,发上来是想整理自己的思路,也希望读者能够多多给意见:)