如何用nodejs做一个简单的前端Static Server

最近在学习nodejs相关的一些知识,动手练永远是进步最快的,业余时间搞了个土鳖项目,叫nodeCombo,主要功能可以参见github地址:https://github.com/xiaojue/node-combo

目前版本不太稳定,争取年前把TODO都完成,再补上测试,最后发布到NPM上。现在的版本如果有人要下,建议用在测试开发环境,有任何bug可以提交给我或者直接帮我重写一下……感激不尽。

下面介绍一下主要的实现思路,API相关可以直接看README。

nodejs的module基本结构可以参考这里:http://nodejs.org/docs/latest/api/modules.html#addenda_Package_Manager_Tips

我这个module目录下主要是这么几个文件:

代码写的都很屎。逐一简单介绍一下吧。

combo,image,resize,template是分别负责合并文本文件,图片文件,重绘图片大小和实现简单的静态模板等功能。

config是进行combo的配置文件,对目录和文件扩展名之类进行了统一控制。

range是实现http中的range响应。

tools是几个可能会通用的工具函数。

requires文件是一个小hack,可以避免少些点require,一会下面介绍。

handle文件是处理http响应的。

server是启动文件。

具体代码可以直接去看文件了,下面开始说实现思路。

如果你对http请求不熟悉,可以参见这里:http://zh.wikipedia.org/wiki/Http%E5%8D%8F%E8%AE%AE#.E4.BE.8B.E5.AD.90

用nodejs实现一个非常简单,比如我的combo模块需要暴露给外部一个run的方法:

exports.run = function(){
var host = config.list.host,
port = config.list.port,
server = http.createServer(handle.run);
server.listen(port);
console.log('server on ' + port);
}

这样一来所有的配置端口的http请求就全部都进到handle.run这个方法里了。那么我在handle.run里要进行各种处理,比如分析请求头的请求文件名字(URL里的filename和filepath),还有比如静态服务器都支持的gzip,range请求,并且返还给浏览器Expires,Cache-Control,Last-Modified,gizp,range等对应信息或者结果。

handle文件写的太屎了,代码也比较长,这是需要重构的,基本的流程就是接受请求,分析url和请求头信息,然后根据一些具体需要,分别交给具体的方法进行处理,比如我请求一个正常的jpg图片,就会直接找服务器对应地址的jpg文件,存在的话用Stream读取,然后返回结果给浏览器,并且附带上响应头。如果我请求的是css,js文件或者combo的js,css,jpg文件,我会根据不同的要求,分发给相应方法进行处理,比如图片就用nodejs的node-canvas进行拼合或者改大小,比如文本,我则会直接进行顺序拼接,再看需要不需要过一遍static模板,最后返回给浏览器。

大概实现思路就是这样。你给我服务器请求,我根据请求返回结果,(如果有特殊要求,我就做特殊处理之后再给你)。主要这些特殊需求都是围绕提高前端生产力来的,所以也可以说是一个前端用着比较舒服的static server吧。

最后说一下我那个requires文件,写过nodejs的都知道,我们总要在每个js文件头部写很多这样的代码:

var fs=require("fs"),
    path=require('path'),
    readline=require('readline')....

用了requires文件,只需要require一次,然后GlobalInit一下就好了,具体可以查看我每个js文件的开头部分。

好了,目前已经实现的例子和用法,文档已经给出,有兴趣可以仔细去看,或者联系我。

下周应该会把less和coffeescript的默认支持也调通,然后再增加combo功能(其实多此一举,less带import的功能),所以也可能不对less支持。

嗯,希望这文章能对学习nodejs的同学有些帮助,有更多想法也可以联系我。

One thought on “如何用nodejs做一个简单的前端Static Server

  1. Pingback: nodejs static server | Designsor

发表评论

电子邮件地址不会被公开。 必填项已用 * 标注

*

您可以使用这些 HTML 标签和属性: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre lang="" line="" escaped="" highlight="">