mod_concat模塊
mod_concat 模塊由淘寶開發（能將js、 css 多個請求合併爲一個請求），目前已經包含在 tengine 中，並且淘寶已經在使用這個 nginx 模塊。不過塔暫時沒有包含在 nginx 中。這個模塊類似於 apache 中的 modconcat。如果需要使用它，需要使用兩個” ?”問號。
範例：http://example.com/??style1.css,style2.css,foo/style3.css
以上將原先 3 個請求合併爲 1 個請求，如果你擔心文件被用戶的瀏覽器緩存而沒有及時更新，你依舊可以帶上一個版本號的參數：http://example.com/??style1.css,style2.css,foo/style3.css?v=102234
可以看到大部分請求使用了兩個問號加多個文件，後面使用逗號方式去返回其內容的。
concat指令塊和指令
concat on | off
default: concat off
context: http, server, location
開啓火關閉 concat
concat_types MIME types
default: concat_types: text/css application/x-javascript
context: http, server, location
Defines the MIME types which can be concatenated in a given context.
在給定的配置段中可以被合併的 MIME 文件類型.
concat_unique on | off
default: concat_unique on
context: http, server, location
是否只允許同類型文件（相同 MIME 文件）合併。例如，設置爲 off，那麼 js 和 css 文件可以合併。默認情況下，這個值是 on，意味着只有相同的類型文件才能合併。
如果希望 js 和 css 能夠合併爲一個請求，那麼你必須設置 concat_unique off，其他類型文件也可以用同樣的方式合併.如下爲 OFF 纔可以的請求：
http://example.com/static/??foo.css,bar/foobaz.js
concat_max_files numberp
default: concat_max_files 10
context: http, server, location
定義一個給定的配置段裏面允許合併文件的數量，默認最多 10 個.不過一定要注意， uri 不要超過系統的規定的page size，在 linux 裏面執行 getconf PAGESIZE 可以獲取系統的限制.通常限制是 4096 字節。
concat_delimiter: string
default: NONE
context: http, server, locatione
定義文件分隔符
concat_ignore_file_error: on | off
default: off
context: http, server, location
是否忽略文件請求錯誤，例如 404 和 403 等
安裝nginx concat
[root@www src]# wget https://github.com/alibaba/nginx-http-concat/archive/master.zip -O nginx-http-concatmaster.zip
[root@www src]# unzip nginx-http-concatmaster.zip
Archive: nginx-http-concatmaster.zip
b8d3e7ec511724a6900ba3915df6b504337891a9
creating: nginx-http-concat-master/
inflating: nginx-http-concat-master/README.md
inflating: nginx-http-concat-master/config
inflating: nginx-http-concat-master/ngx_http_concat_module.c
[root@www nginx-1.16.1]# ./configure --prefix=/usr/local/nginx --with-http_stub_status_module --add-module=../nginx-http-concat-master
[root@www nginx-1.16.1]# make && make install
[root@www nginx-1.16.1]#make upgrade
[root@www nginx-1.16.1]# /usr/local/nginx/sbin/nginx -V
nginx version: nginx/1.16.1
built by gcc 4.8.5 20150623 (Red Hat 4.8.5-39) (GCC)
configure arguments: --prefix=/usr/local/nginx --with-http_stub_status_module --add-module=../nginx-http-concat-master
配置Nginx
server {
listen 80;
server_name www.ttlsa.com;
root /data/site/www.ttlsa.com;
location /static/ {
concat on;
concat_max_files 20;
concat_unique off;
}
}
測試Nginx concat
我的站點有調用到 static/ttlsa_concat.css 和 static/ttlsa_concat.js 兩個文件，爲了提高站點訪問速度，我
決定使用 nginx 的 concat 模塊將兩個請求合併爲一個。
合併前:
www.ttlsa.com/static/css/ttsa_concat.css
www.ttlsa.com/static/js/ttsa_concat.js
合併後:
http://www.ttlsa.com/static??js/ttlsa_concat.js,css/ttlsa_concat.css?ver=123
測試之前，準備一下文件
# cd /data/site/www.ttlsa.com/static
# cat js/ttlsa_concat.js
// this is js file ttlsa_concat.js
# cat js/a.js
// this is js file a.js
# cat css/a.css
/** this is css a.css **/
# cat css/ttlsa_concat.css
/** this is css ttlsa_concat.css **/
（1）兩個 css 合併
# curl http://www.ttlsa.com/static/??css/ttlsa_concat.css,css/a.css
/** this is css ttlsa_concat.css **/
/** this is css a.css *
（2）兩個 js 合併
# curl http://www.ttlsa.com/static/??js/ttlsa_concat.js,js/a.js
// this is js file ttlsa_concat.js
// this is js file a.js
（3） js 與 css 合併
# curl http://www.ttlsa.com/static/??js/ttlsa_concat.js,css/ttlsa_concat.css
// this is js file ttlsa_concat.js
/** this is css ttlsa_concat.css **/
（4）帶版本號參數
# curl http://www.ttlsa.com/static/??css/ttlsa_concat.css,css/a.css?123
/** this is css ttlsa_concat.css **/
/** this is css a.css *
以上僅僅用了兩個文件來測試，在具體應用中，大家可以使用多個，具體幾個由你的 nginx 配置來控制. 在具體的環
境中，都是以下方式來調用，以下方法摘自官方文檔.
js：
<script src="??bar1.js,bar22.css,subdir/bar3.js?v=3245" />
以上意思是將 ba1.Js， bar22.css 和 subdir/bar3.js 這三個請求合併爲一個，並且版本號爲 3245.
css:
<link rel="stylesheet" href="??foo1.css,foo2.css,subdir/foo3.css?v=2345" />
這邊也是一個道理,只不過只包含 css.
總結
減少 web 請求在一定程度上能減少 web 服務器的壓力，簡單的使用 nginx concat 模塊便可以實現這個功能，不過
需要前端設計師來使用。如果想減少 web 請求，又不想讓前端設計師來插手的話，大家可以參考下 google 出的
pagespeed 模塊