middleware模块开发和引入

准备

使用 $npm install http-f2e-server@0.0.8 进行安装之前版本,本篇在此基础上利用中间件的模式增加功能,对诸如LESS、jade、coffeeScript文件文本的动态解析输出。

添加依赖

middleware的一些模块, 我们使用开发依赖不在安装http-f2e-server的时候直接下载。
因此添加依赖的时候放在devDependencies参数上面。

"devDependencies": {
    "jade":">=1.7.0",
    "coffee-script": ">=1.8.0",
    "less": "2.0.0",
    "markdown":">=0.5.0"
  },

然后 npm install 安装所有中间件依赖模块

添加模块入口

因为中间件都是对字符串的操作,我将入口放在 mime.isTXT(pathname) 条件下。可以根据自己需求,放在跟handle模块同级或者内部判断, 原版 f2e-server 是和handle模块并行的,这版处理的时候使用在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内部

创建中间件模块,依次根据各种文件后缀名创建解析方法,在内部使用resp输出结果,首先创建最简单的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模块相关的API可以查看github:https://github.com/evilstreak/markdown-js
这里完成后,直接从浏览器访问 http://localhost:8888/README.md 就能够获取到markdown解析结果HTML了

添加更多解析器

  • LESS
    因为LESS后缀在mime中不能获取到和css一样的type,我们需要去修改包装的mime对应方法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 );
            }
        });
}

但是事实上,你去直接访问对应的less文件链接的时候服务端竟然返回空, 这是由于在主模块中...

else if( mime.isTXT(pathname) ){
        rs.on("end",function(){
                str = require("./lib/handle").execute(str, root, req, resp);  //将处理过程用一个新的模块实现
                resp.end( str );
        });
}

把handle模块的执行结果已经当作字符串输出到响应中,但是在LESS解析器模块中的处理过程是异步监听机制的,我们需要修改这里当没有数据返回的时候不要使用响应输出。

else if( mime.isTXT(pathname) ){
        rs.on("end",function(){
                str = require("./lib/handle").execute(str, root, req, resp);  //将处理过程用一个新的模块实现
                if(typeof str != "undefined") resp.end( str ); //只有返回结果不是undefined时,才直接输出
        });
}

然后再次测试,你对应的LESS资源, ! 妥妥的了 !

更多解析器

可以自行查看更多相关模块的API (查看各个模块的package.json中的git地址查看)

PS:

相关完整代码已经发布到了npm仓库中, 可以使用 $npm install http-f2e-server@0.0.9 进行安装或者更新。进入目录后使用 $node http-f2e-server.js 启动服务,并查看Demo。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 135,186评论 19 139
  • 前言 众所周知目前比较火的工具就是gulp和webpack,但webpack和gulp却有所不同,本人两者的底层研...
    cduyzh阅读 1,409评论 0 13
  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 174,143评论 25 709
  • ## 前端开发的工具 ### 编辑器: 1. 轻量级的,依靠插件:sublime;atom(github);vs ...
    浪流儿阅读 3,269评论 0 2
  • 作者 王崇信 ●铸 你在高温中升华,在烈焰里沸腾,带着炙热的气浪,闪着彩虹般的光芒,心悦诚服地去表现自己应有的形象...
    冰洋映红阅读 229评论 0 0