nginx的动静分离

快来打我* 2022-03-11 09:41 227阅读 0赞

### 动态资源、静态资源分离 ###

动态资源、静态资源分离是让动态网站里的动态网页根据一定规则把不变的资源和经常变的资源区分开来，动静资源做好了拆分以后，我们就可以根据静态资源的特点将其做缓存操作，这就是网站静态化处理的核心思路  
    动态资源、静态资源分离简单的概括是：动态文件与静态文件的分离

### 为什么要做动、静分离？ ###

在我们的软件开发中，有些请求是需要后台处理的（如：.jsp,.do等等），有些请求是不需要经过后台处理的（如：css、html、jpg、js等等文件），这些不需要经过后台处理的文件称为静态文件，否则动态文件。因此我们后台处理忽略静态文件。这会有人又说那我后台忽略静态文件不就完了吗。当然这是可以的，但是这样后台的请求次数就明显增多了。在我们对资源的响应速度有要求的时候，我们应该使用这种动静分离的策略去解决动、静分离将网站静态资源（HTML，JavaScript，CSS，img等文件）与后台应用分开部署，提高用户访问静态代码的速度，降低对后台应用访问，这里我们将静态资源放到nginx中，动态资源转发到tomcat服务器中。

### nginx动静分离的实现 ###

场景：一台电脑172.16.25.44这台电脑，上面部署了Tomcat，里面8080端口有J2EE的服务，通过浏览器可以正常浏览网页（url:http://172.16.25.44:8080/rsbi）。现在有一个问题tomcat是一个比较全面的web容器，对静态网页的处理，应该是比较费资源的，特别是每次都要从磁盘读取静态页面，然后返回。这中间会消耗Tomcat的资源，可能会使那些动态页面解析性能影响。秉承Linux哲学，一个软件只做一件事的原则。Tomcat就应该只处理JSP动态页面。这里就用到以前了解的Nginx来进行反向代理.

### 静态资源实现的动静分离 ###

nginx.conf

worker_processes 2;
    
            pid /usr/local/var/run/nginx.pid;
    
            worker_rlimit_nofile 65535;
            
            events{
                #use epoll;
                worker_connections 65535;
            }
            
            http{
                include mime.types;
                default_type application/octet-stream;
                sendfile on;
                tcp_nopush on;
                tcp_nodelay on;
                keepalive_timeout 65;
                types_hash_max_size 2048;
    
                proxy_redirect off;
                proxy_set_header Host $host;
                proxy_set_header X-Real-IP $remote_addr;
                proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
                client_max_body_size 10m;
                client_body_buffer_size 128k;
                proxy_connect_timeout 65;
                proxy_send_timeout 65;
                proxy_read_timeout 65;
                proxy_buffer_size 4k;
                proxy_buffers 4 32k;
                proxy_busy_buffers_size 64k;
            
                server{
                    listen 8081;
                    server_name localhost;
                    location / {
                         index index.jsp index.html index.htm index.php; 
                    }
                    location ~ .*\.(js|css|ico|png|jpg|eot|svg|ttf|woff) {
                        proxy_pass http://172.16.25.44:8080;
                        expires 30d; 
                    }
                    location ~ .*$ {
                        index index;
                        proxy_pass http://172.16.25.44:8080;
                    }
                }
            }

server段里面的解释如下：第35行为监听本机8081端口。37-39行表示默认主页. 关键的第40行，这个是正则匹配，网上也有很多介绍。这里匹配我项目中用到的所有静态网页后缀。第41行是代理地址。这里我代理到我的web应用中。expires 30d缓存为30天，这里的缓存是对应到前端页面，用户的Cache-Control字段，页面能看到response header中：Cache-Control: max-age=2592000  
如下图所示，  
![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2gyNjA0Mzk2NzM5_size_16_color_FFFFFF_t_70][]

第44行中那个正则是匹配无后缀的页面。我项目中jsp页面是无后缀的。这里可以根据需要进行修改。同样代理到172.16.25.44:8080这里。到这里你可能会问，我艹，这有毛意思啊？当然不是这样了。简单的实现静动分离，我们可以把第41行进行修改，改为：  
root   /users/dev/apache-tomcat-8.5.33/webapps/

说明：tomcat中静态资源的绝对路径,root字段无需修改，后面的路径是你项目发布到的的位置，如我在idea中配置项目发布的位置如下如下，

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2gyNjA0Mzk2NzM5_size_16_color_FFFFFF_t_70 1][]  
并且注意因为访问的时候要带上rsbi，所以上面的webapps/后面没有加rsbi。

重启nginx后再次输入http://localhost:8081/rsbi 访问页面，ok。

### nginx反向代理实现动静分离 ###

上面的方式本质上没有用到nginx的代理功能，直接从本地磁盘拿静态文件，即静态文件必须和nginx在同一台机器上，问题：灵活性不好，对下面要讲到的内存缓存和集群部署来说都是不友好的

解决方案  
增加server，修改nginx.conf中静态资源的proxy\_pass,即  
server\{  
        listen 8082;  
        server\_name localhost;  
        location / \{

\}  
        location ~ .\*\\.(js|css|ico|png|jpg|eot|svg|ttf|woff) \{  
            \#所有静态文件直接读取硬盘  
            root   /users/dev/apache-tomcat-8.5.33/webapps/;  
            expires 30d; \#缓存30天  
        \}  
    \}  
监听8082端口，然后上上面的代码41行就可以修改为 proxy\_pass http://172.16.25.44:8082了，到这里就实现了动静分离了。  
可能你会有疑问，上面实际读取的还是/users/dev/apache-tomcat-8.5.33/webapps/路径下的，是的 ，但是该路径所在的机器不需要和nginx必须在同一台机器了。

如果多台服务器，就修改对应的ip就可以了。如果发现连接不上的，要检查一下防火墙，权限等外部问题。

借鉴：[https://www.cnblogs.com/wunaozai/p/5001742.html][https_www.cnblogs.com_wunaozai_p_5001742.html]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2gyNjA0Mzk2NzM5_size_16_color_FFFFFF_t_70]: /images/20220311/85b9d34cadeb4fb493524ea85d9a9d0d.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2gyNjA0Mzk2NzM5_size_16_color_FFFFFF_t_70 1]: /images/20220311/68c551437cd14e3e8abf913e65567fa5.png
[https_www.cnblogs.com_wunaozai_p_5001742.html]: https://www.cnblogs.com/wunaozai/p/5001742.html