使用nginx-http-concat优化网站响应

时间  2019-11-06
标签 使用 nginx http concat 优化 网站 响应 栏目 Nginx 繁體版
原文   原文链接

前言：javascript

咱们在访问淘宝的时候，会看到代码中的js和css文件是经过一次请求或得的，咱们知道浏览器一次请求只能并发访问数个资源，这样的处理错输在网络传输层面能够大大节省时间，这里使用的技术就是把css、js等静态资源合并为一个资源。淘宝使用的tengine是基于nginx的web服务器，从11年末开源。所使用的是mod_concat模块，合并多个文件在一个响应报文中。php

http1.1下浏览器的并发访问资源数css

IE6                                 2
IE7                                 2
IE8                                 6
Firefox2                          2
Firefox3                          6
Safari 3,4                       4     
Chrome 1,2                    6     
Opera 9.63,10.00alpha    4 html

 

 

1、 CENTOS下安装使用java

安装nginx concat,因为此模块只能在linux环境中使用，在开发过程当中如何在windows环境下使用在本文下面重点介绍。下面先介绍如何在CentOS中使用，因为此模块和nginx配合使用，而nginx通常都是由咱们本身编译使用的，因此这里介绍自行编译方法，关于concat模块的具体使用技巧，网上不少文章介绍，反而在centos尤为在windows环境下如何搭建环境，至今没有一篇很是详细的文章，这也是本身汇总整理的初衷，若是网上有现成的教程，咱们本身真的就懒得写了（咱们都是懒人一枚）jquery

1.安装nginx concatlinux

1 # cd /usr/local/src/
2 # wget http://nginx.org/download/nginx-1.4.2.tar.gz
3 #wget https://github.com/alibaba/nginx-http-concat/archive/master.zip -O nginx-http-concat-master.zip
4 # unzip nginx-http-concat-master.zip
5 # tar -xzvf nginx-1.4.2.tar.gz
6 # cd nginx-1.4.2
7 vi auto/cc/gcc

#将这句注释掉 取消Debug编译模式 大概在174行nginx

 
 
#CFLAGS="$CFLAGS -g"git
 
 
 
 

 

咱们再配置下nginx编译参数github
 

 
 
1 ./configure --prefix=/usr/local/app/nginx --user=www --group=www --with-http_stub_status_module --with-http_ssl_module --add-module=../nginx-http-concat-master
2 make
3 make install
 

 

固然别忘记增长用户和用户组
 

 
 
1 #/usr/sbin/groupadd -f www
2 #/usr/sbin/useradd -g www www
 

 

至此组件和nginx编译完成
 

2.nginx conf调整
 

 Nginx的控制文件有不一样的写法，个人配置文件使用了vhost因此在location段增长以下便可。
 

 
 
1         concat on;
2         concat_max_files 20;
3         concat_unique off;
4         concat_types text/css application/javascript;
 

 

例子以下：
 

 
 
 1 ## Try the requested URI as files before handling it to PHP.
 2     location / {
 3 
 4         ## Regular PHP processing.
 5         location ~ \.php$ {
 6             root     /home/webroot;
 7             try_files  $uri =404;
 8             fastcgi_pass   127.0.0.1:9000;
 9             fastcgi_index  index.php;
10             fastcgi_split_path_info ^(.+\.php)(.*)$;
11             fastcgi_param  SCRIPT_FILENAME    $document_root$fastcgi_script_name;
12             include        fastcgi_params;
13             #added by james for test
14             fastcgi_buffer_size 128k;
15             fastcgi_buffers 2 256k; # up to 1k + 128 * 1k
16             fastcgi_busy_buffers_size 256k;
17             fastcgi_temp_file_write_size 256k;
18             fastcgi_max_temp_file_size 0;
19             proxy_buffering off;
20             gzip off;
21 
22 
23             fastcgi_connect_timeout 75;
24 fastcgi_read_timeout 600;
25 fastcgi_send_timeout 600;
26         }
27         
28         if ($request_uri  ~* "system/dict"){
29                 rewrite  ^/(.*)/(.*)/(.*)/(.*)$ /$1/index.php last; break;
30             }
31         if ($request_uri  ~* "system/menu"){
32                 rewrite  ^/(.*)/(.*)/(.*)/(.*)$ /$1/index.php last; break;
33                 }
34         if (!-e $request_filename) {
35             rewrite  ^/(.*)/(.*)/(.*)$ /$1/index.php last; break;
36         }
37         
38         concat on;
39         concat_max_files 20;
40         concat_unique off;
41         concat_types text/css application/javascript;
42       } # / location
 

 

重启ninx应用便可生效。
 

#Killall nginx
 

#nginx
 

 
 

3.页面写法
 

Concat须要使用两个？来标明做用域，具体的使用细节网上不少文章已经介绍的很详细了，这也不是本文的重点，这里只是给出一个示例。注意啊,css要在上面啊，不清楚的本身搜索下http请求优化。
 

 
 
1 <link rel="stylesheet" type="text/css" href="/??ui/easyui/themes/icon.css,ui/easyui/themes/default/easyui.css,console/portal/resources/css/style.css">
2 <script type="text/javascript" src="/ui/easyui/??jquery.min.js,jquery.easyui.min.js"></script>
 

 

 
 

2、 在windows 下的使用
 

是否是以为上面很简单啊，我也以为，可是在windows下就悲催了，concat只能在linux环境下，可是如今通常咱们的开发环境就是在windows下，调试起来很是不方便，这就须要咱们有一个能够在windows 下编译进去concat模块的nginx.exe，怎么办，只能本身编译了，由于你们实际项目中采用的nginx中的编译参数千差万别，不可能从网上下载一个别人编译好的就能用的。
 

在windows下咱们须要使用cygwin，具体这个软件如何使用，教程一大把，咱们就用它来做为一个linux通向windows的桥梁。
 

1.        安装cygwin
 

从网上能够下载已经集成了一部分组件的软件或者是本身下载的都行，这里须要注意的是，由于咱们在实际使用中，在不一样的时候须要不一样的组件，所以迫切须要一个相似在CENTOS中的yum中的东西，在cygwin中还真有，叫作apt-cyg

 

 
 
1 lynx -source rawgit.com/transcode-open/apt-cyg/master/apt-cyg > apt-cyg
2 install apt-cyg /bin
3 Example use of apt-cyg:
4 apt-cyg install nano
 

 

固然apt-cyg还有不少功能，本身apt-cyg –help
 

 2.        在cygwin中编译nginx
 

搭建好cygwin环境中，咱们看到大部分的操做和linux中操做不大，可是咱们一旦用上，会发现不少地方有一些小的差别，好比vi咱们的上下键和退回键彻底不生效，产生了一堆莫名其妙的ABCD,我也是尝试了半天不起做用，没办法用了vim，哎还真还用，别纠结vi了用vim,难怪linux中不少人也说vim更好用。
 

在编译nginx以前咱们须要下载一些包，这些固然是用apt-cyg install了，可是注意一些不能一块儿安装，那就一个一个安装好。
 

     
 
  • openssl、pcre、zlib、automake 、bison 、curl-devel 、flex 、libiconv 、libmcrypt-devel 、libtool 、libxml2 、libxml2-devel 、patchutils 、pcre-devel 、jpeg 、libmcrypt 、libpcre-devel、openssl-devel
    •  

 

    在安装的时候若是还提示缺乏包，那按照提示安装对应的包便可。
 

  2.1 下载安装nginx
 

 
 
 1 # cd /usr/local/src/
 2 # wget http://nginx.org/download/nginx-1.4.2.tar.gz
 3 #wget https://github.com/alibaba/nginx-http-concat/archive/master.zip -O nginx-http-concat-master.zip
 4 # unzip nginx-http-concat-master.zip
 5 # tar -xzvf nginx-1.4.2.tar.gz
 6 # cd nginx-1.4.2
 7 vi auto/cc/gcc
 8 #将这句注释掉 取消Debug编译模式 大概在174行
 9 #CFLAGS="$CFLAGS -g"
10 #咱们再配置下nginx编译参数
 

 

以上咱们和在centos中彻底同样，可是注意接下来咱们在编译的时候—prefix参数不能指定死，由于若是咱们在这里指定相似/usr/local的路径，那咱们只能在cygwin环境中使用了，可是咱们是要在windows中使用，这里就必须使用相对地址，也也是为何后面咱们的程序文件不能随便在windows下的盘符的缘由。这里给出个人编译参数
 

 
 
1 ./configure \
2 --prefix=. \
3 --user=www \
4 --group=www1 \
5 --with-http_stub_status_module \
6 --with-http_ssl_module \
7 --add-module=../nginx-http-concat-master
 

 

2.2 用户和组处理
 

先不要执行，这里咱们使用的用户www和组www1尚未创建，可是在cygwin中没有useadd和groupadd找了不少资料，中文的基本没有才搞清楚，cygwin是使用的windows的用户和组，这里咱们先在windows中创建用户www和组www1，为何组是www1，万恶的windows居然不让组和用户一个名，不过不要紧
 

而后在cygwin中执行，就是把windows中的用户和组同步到cygwin中
 

 
 
1 mkpasswd -l > /etc/passwd 
2 mkgroup -l > /etc/group 
 

 

执行完毕后cat下passwd和group看用户和组导入进去没有
 

2.3     编译make错误处理
 

这里你们可能会遇到各类问题，个人编译没问题在make阶段报错提示ngx_user.c文件中的crypt错误，找了不少资料没有发现你们和我同样的问题，既然是crypt确定是加密，检查了crypt包也安装了（apt-cyg install crypt）,最后直接修改了源码的c文件把加密的这步省略了，就过去了。
 

 
 
1 原始文件：
2   value = crypt((char *) key, (char *) salt);
3 直接修改成：
4   value = (char *) salt);
 

 

 3.        使用nginx.exe
 

咱们把编译好的nginx.exe直接copy到咱们的wnmp环境中，替换nginx文件后是不能直接使用的会提示缺乏不少dll的，按照提示把这些dll拷贝到和nginx同级的目录便可，咱们的是这些dll
 

 
 

启动后虽然没有报错，可是页面报404，咱们运行nginx.exe –t发现提示链接数错误，这里有不少修改办法，因为开发环境没有那么多链接数，直接修改nginx.conf修改成64
 

worker_connections  64;
 

 
 

启动,OK,运行info.php没问题，一切正常。可是别高兴，后面还有问题，由于咱们在windows的开发环境下，咱们的配置参数通常都是d:\work\相似的路径，info.php能运行起来，咱们的项目不必定能运行起来，由于咱们以前编译使用的相对路径，由于../d:\abc其实是不能运行的。由于咱们须要将咱们的工程文件放入到html文件中，同时咱们对应的配置nginx.conf文件修改对应的工程路径便可。


        

            

        	





    

		

            
相关文章

            

                

                

                    

                

            


            
相关标签/搜索

            
        


    

        

            

        

        

        
        

        

        

    




	

    





    

    	

    

        每日一句
    

    
    
    	每一个你不满意的现在，都有一个你没有努力的曾经。
    







    

    


    



    

        本站公众号
    

    

           欢迎关注本站公众号,获取更多信息

        
    




    

    




	


	







    

        联系我们
        最近搜索
        最新文章
        
        沪ICP备13005482号-10

            MyBatis教程
            SQL 教程
            MySQL教程
            Java 教程
            Thymeleaf 教程
            Hibernate教程
            Spring教程 
            Redis教程