nginx合并前端资源nginx-http-concat模块

介绍

nginx-http-concat,可以减少http请求,从而减轻了服务器的请求压力,更快的响应。 每个http请求的应答都是非常昂贵的, 并且我们知道浏览器本身也有并发请求限制,当一个网站并发请求非常多时,也会非常影响性能的。

通常来说合并css、js也是为了将很多小的css文件全部合并成一个http返回,也是非常重要的优化手段,对于前端工程实现来说,也比较清晰.

像淘宝的链接很多都是taobao.com/a.js,b.js,c.js

部署

1
2
3
git clone https://github.com/alibaba/nginx-http-concat.git
./configure --add-module=./nginx-http-concat/
make && make install

模块详解

在配置的地方使模块有效(失效)

concat on | off
默认: concat off
上下文: http, server, location

定义哪些mime types是可以被接受

concat_types MIME types
默认: concat_types: text/css application/x-javascript
上下文: http, server, location

定义是否只接受在[MIME types]中的相同类型的文件

concat_unique on | off
默认: concat_unique on
上下文: http, server, location

定义最大能接受的文件数量。

concat_max_files number
默认: concat_max_files 10
上下文: http, server, location

定义在文件之间添加分隔符

concat_delimiter string
默认:
上下文 ‘http, server, location’

定义模块是否忽略文件不存在(404)或者没有权限(403)错误

concat_ignore_file_error ‘on | off’
默认 ‘concat_ignore_file_error off’
上下文 ‘http, server, location’

注意:使用中发现对JS使用标准MIME-Type(application/X-javascript)导致的400 Bad Request ,我是通过修改contat的源码,加上javascript,就可以了。

1
2
3
4
5
6
location / {
concat on;
concat_max_files 100;
concat_delimiter '';
concat_unique off;
concat_ignore_file_error on;

参考链接

Donate