準(zhǔn)備
使用 $npm install http-f2e-server@0.0.8 進(jìn)行安裝之前版本，本篇在此基礎(chǔ)上利用中間件的模式增加功能，對(duì)諸如LESS、jade、coffeeScript文件文本的動(dòng)態(tài)解析輸出。
添加依賴
middleware的一些模塊， 我們使用開發(fā)依賴不在安裝http-f2e-server的時(shí)候直接下載。
因此添加依賴的時(shí)候放在devDependencies參數(shù)上面。
"devDependencies": {
"jade":">=1.7.0",
"coffee-script": ">=1.8.0",
"less": "2.0.0",
"markdown":">=0.5.0"
},
然后 npm install 安裝所有中間件依賴模塊
添加模塊入口
因?yàn)橹虚g件都是對(duì)字符串的操作，我將入口放在 mime.isTXT(pathname) 條件下?？梢愿鶕?jù)自己需求，放在跟handle模塊同級(jí)或者內(nèi)部判斷， 原版 f2e-server 是和handle模塊并行的，這版處理的時(shí)候使用在handle模塊里面。
var compiled = _.template(str),
result = compiled({require: require,request:req,response:resp}),
mw;
if( mw = middleware[ req.url.match(/\b(\w+)$/)[1] ] ){
mw(str,root,req,resp);
}else{
return str;
}
在middleware內(nèi)部
創(chuàng)建中間件模塊，依次根據(jù)各種文件后綴名創(chuàng)建解析方法，在內(nèi)部使用resp輸出結(jié)果，首先創(chuàng)建最簡(jiǎn)單的markdown解析， 如下：
"use strict";
var mime = require("./mime");
module.exports = {
md: function(str,root,req,resp){
resp.writeHead(200,{"Content-Type": mime.lookup('html')});
var output = require( "markdown" ).markdown.toHTML(str + '');
resp.end( '<style>code{padding:2px 8px;background:#eee;}</style>' + output, "utf-8" );
}
};
markdown模塊相關(guān)的API可以查看github:https://github.com/evilstreak/markdown-js
這里完成后，直接從瀏覽器訪問 http://localhost:8888/README.md 就能夠獲取到markdown解析結(jié)果HTML了
添加更多解析器
- LESS
因?yàn)長(zhǎng)ESS后綴在mime中不能獲取到和css一樣的type，我們需要去修改包裝的mime對(duì)應(yīng)方法lookup
var mime = require("mime");
module.exports = {
isTXT: function(path){
return /\b(text|xml|javascript|json)\b/.test( this.lookup(path) );
},
lookup: function(path){
if( /\bless\b/.test(path) ){
return mime.lookup("css");
}else{
return mime.lookup(path);
}
}
};
然后添加less解析器
less: function(str,root,req,resp){
require("less").render(str, function (err, output) {
if (err) { throw err }
else{
resp.end( output.css );
}
});
}
但是事實(shí)上，你去直接訪問對(duì)應(yīng)的less文件鏈接的時(shí)候服務(wù)端竟然返回空， 這是由于在主模塊中...
else if( mime.isTXT(pathname) ){
rs.on("end",function(){
str = require("./lib/handle").execute(str, root, req, resp); //將處理過程用一個(gè)新的模塊實(shí)現(xiàn)
resp.end( str );
});
}
把handle模塊的執(zhí)行結(jié)果已經(jīng)當(dāng)作字符串輸出到響應(yīng)中，但是在LESS解析器模塊中的處理過程是異步監(jiān)聽機(jī)制的，我們需要修改這里當(dāng)沒有數(shù)據(jù)返回的時(shí)候不要使用響應(yīng)輸出。
else if( mime.isTXT(pathname) ){
rs.on("end",function(){
str = require("./lib/handle").execute(str, root, req, resp); //將處理過程用一個(gè)新的模塊實(shí)現(xiàn)
if(typeof str != "undefined") resp.end( str ); //只有返回結(jié)果不是undefined時(shí)，才直接輸出
});
}
然后再次測(cè)試，你對(duì)應(yīng)的LESS資源， ! 妥妥的了 !
更多解析器
可以自行查看更多相關(guān)模塊的API （查看各個(gè)模塊的package.json中的git地址查看）
PS:
相關(guān)完整代碼已經(jīng)發(fā)布到了npm倉(cāng)庫(kù)中， 可以使用 $npm install http-f2e-server@0.0.9 進(jìn)行安裝或者更新。進(jìn)入目錄后使用 $node http-f2e-server.js 啟動(dòng)服務(wù)，并查看Demo。
