提供了编程的基础技术教程

zl程序教程

您现在的位置是：首页 >  其他

当前栏目

nginx中使用nginx-http-concat模块合并静态资源文件

文件静态资源模块NginxHTTP 使用 合并
2023-06-13 09:15:32 时间

首先了解一下nginx-http-concat，他是一个淘宝的开源Nginx模块，是一个能把多个CSS和JS合并成一个请求的Nginx模块，对于Web性能优化非常有意义。

Github地址：https://github.com/alibaba/nginx-http-concat，

先看看淘宝用起来是什么样的，访问淘宝网主页，查看源代码可以看到类似的这样的style/script链接

复制代码代码如下:

<linkrel="stylesheet"href="//g.tbcdn.cn/??tb/global/2.1.6/global-min.css,tb/tb-fp/1.2.3/style-min.css?t=20130912">
<scriptsrc="//g.tbcdn.cn/??kissy/k/1.3.1/seed-min.js,tb/global/2.1.6/global-min.js,tb/tb-fp/1.2.3/core-min.js?t=20130912"></script>

是不是很神奇，只需要一个请求，就可以把需要的CSS/JS文件通过合并的方式把他输出成一个文件(注意，虽然淘宝有min格式的文件，但是这里它仅仅是合并多个文件，而不会自动的对其压缩打包文件)

首先我们先从Git上下载安装它

复制代码代码如下:

#下载
$gitclonegit://github.com/alibaba/nginx-http-concat.git
 
#移动目录
$mvnginx-http-concat/usr/local/src/nginx-http-concat

查看原始Nginx版本，这很重要，因为我们需要安装同一个版本来升级数据
复制代码代码如下:
#查看版本号以及配置信息(目录/模块)
$/usr/local/nginx/sbin/nginx-V
nginxversion:nginx/1.3.1
TLSSNIsupportdisabled
configurearguments:--prefix=/usr/local/nginx--with-http_stub_status_module--with-http_ssl_module--with-http_gzip_static_module

根据查询的版本号下载对应版本的nginx，可以到官方下载指定版本：http://nginx.org/download/

我这里使用的是1.3.1

复制代码代码如下:
$wgetnginx-1.3.1.tar.gz
$tarzxvfnginx-1.3.1.tar.gz
$cdnginx-1.3.1
#根据上面-V的信息加入concat模块所在路径(--add-module=/usr/local/src/nginx-http-concat)进行编译
$./configure--prefix=/usr/local/nginx--with-http_stub_status_module--with-http_ssl_module--with-http_gzip_static_module--add-module=/usr/local/src/nginx-http-concat

make之前备份配置文件，防止意外

复制代码代码如下:
$cp-r/usr/local/nginx/conf/root/nginxconf
#编译安装
$make&&makeinstall
接下来就是配置你的静态服务器conf文件
复制代码代码如下:
server{
       listen      80;
       server_namestatic.dexphp.loc;
       indexindex.htmlindex.htm;
       root /mnt/siteroot/static.dexphp.com;
               
       location/static/css/{
               concaton;
               concat_max_files20;//最大合并文件数量是20个
       }
 
       location/status{
               stub_statuson;
               access_log  off;
       }
 
       location~.*\.(gif|jpg|jpeg|png|bmp|swf|js)${
               expires     off;
       }
 
       error_log  /mnt/siteroot/wwwlogs/static.dexphp.loc.error.log;
       access_log /mnt/siteroot/wwwlogs/static.dexphp.loc.access.log;
}

相关文章