网站中的css、js等都是小文件,这类文件的特点是小而多,造成网站加载时http请求多,但网络传输时间短。对于这类小文件来说请求时间和传输时间差不多,甚至请求时间比传输时间还长。当你的网站中这类小文件很多时,大量的http请求就会造成传输效率低,影响网站的加载速度,这时合并http请求就非常有必要了。nginx的concat模块就提供了合并文件http请求的功能,这个模块由淘宝开发,功能和apache的mod_concat模块差不多。

要使用concat模块需要重新编译nginx:


configure --with-http_concat_module 

tengine支持动态模块,也可以编译成动态文件,我这里使用静态方式。

配置非常简单,直接贴一个例子:

#合并css/js
location / {
     concat on;                #启用concat
     concat_unique off;        #是否只接受相同类型的文件(off可以js,css等同时合并)
     concat_delimiter "\n";    #响应时在文件名后添加换行符
     concat_types concat_types: text/css application/javascript;      #定义MIME types
     concat_ignore_file_error off;   #是否忽略404或者没有权限(403)错误
     concat_max_files 20;            #最大能接受的文件数量
    }

设置好后重新加载nginx,使用方法:用两个问号调用模块,一个问号带上版本号等参数,用逗号分隔文件。举例说明:

1.合并三个文件请求

http://www.52os.net/??body.css,style.css,admin.css

2.合并文件请求并带上版本号

http://www.52os.net/??body.css?ver=1.1,style.css?ver=2.2,admin.css?ver=3.3

3.合并不同目录的css请求

http://www.52os.net/??/body.css,/main/style.css,/admin/admin.css

测试时直接把上面的url在浏览器里打开,查看内容即可。合并js和css配置方法类似,但要注意,concat默认js的MIME types是application/x-javascript,有的网站调用js的MIME types是:application/javascript,MIME types不一致合并后浏览器会出现400 Bad Request,事实证明,使用该模块后多数400的情况都是由于MIME types导致的。

当然啦,这个模块不仅仅能合并css和js文件,其他类型的文件只要将对应的MINE types添加到concat_types参数中即可。
关于更多的MIME type,请见:http://www.iana.org/assignments/media-types/media-types.xhtml

参考文章:
http://tengine.taobao.org/document_cn/http_concat_cn.html