Nginx实现合并多个静态文件，减少http请求

http://example.com/??style1.css,style2.css,foo/style3.css

# nginx -V

# wget http://nginx.org/download/nginx-1.4.4.tar.gz[/code] 
3、解压 nginx-1.4.4.tar.gz 并进入目录

# tar -xf nginx-1.4.4.tar.gz
# cd nginx-1.4.4


4、下载 nginx-http-concat

# git clone git://github.com/alibaba/nginx-http-concat.git


5、配置模块并编译

# ./configure --user=www --group=www --prefix=/usr/local/nginx --with-http_stub_status_module --without-http-cache --with-http_ssl_module --with-http_gzip_static_module --add-module=/root/nginx-1.4.4/nginx-http-concat
# make

这里记得不要用 make install,否则会直接覆盖之前的nginx

6、备份原来的 nginx，并替换最新nginx(替换之前先关闭nginx)

# cp /usr/local/nginx/sbin/nginx /usr/local/nginx/sbin/nginx.bak
# cp objs/nginx /usr/local/nginx/sbin/nginx


7、配置 concat(配置成功后记得重启nginx)

location /js/ {
concat on;
# 允许concat最大的文件数
concat_max_files 10;
# 只允许相同类型的文件
concat_unique on;
# 允许内容的类型
concat_types application/x-javascript,text/css;
}


8、测试是否成功

8.1、我们在js目录下分别创建1.js和2.js

//1.js
console.log('1.js load success!');

//2.js
console.log('2.js load success!');

8.2、在页面上引入合并后的js

<script src="./js/??1.js,2.js"></script>

8.3、执行结果



9、K.O

PS:APACHE也有一个类似功能的插件 mod concatx，有兴趣的童鞋可以去了解一下。