Windows下实现Nginx+Tomcat动静分离

深藏阁楼爱情的钟 2022-06-12 08:28 140阅读 0赞

**一、什么是动静分离**

所谓动静分离就是通过nginx（或apache等）来处理用户端请求的图片、html等静态的文件，tomcat（或weblogic）处理jsp、do等动态文件，从而达到动静页面访问时通过不同的容器来处理。

nginx处理静态页面效率远高于tomcat，而tomcat擅长动态页面处理，这样一来就能更好的提高并发，处理性能。

**二、结构图**

![20170719220811281][]

**三、安装Nginx**

从Nginx官网[http://nginx.org/][http_nginx.org]下载最新的版本:

![20170719221129846][]

其中,mainline是主线版,stable是稳定版,这里选择稳定版进行下载,下载下来之后,解压如下:

![20170719221410720][]

点击nginx.exe运行Nginx,然后访问localhost,出现如下的页面

![20170719221752041][]

**四、安装、配置Tomcat**

首先要安装JDK,至于如何安装,百度一搜就出来,安装好JDK之后,安装Tomcat,去官网[http://tomcat.apache.org/index.html][http_tomcat.apache.org_index.html]下载最新的Tomcat进行安装:

![20170719223947636][]

选择Tomcat9

![20170719230215496][]

选择Core进行,下载下来之后,解压如下:

![20170719230435624][]

然后运行bin目录下的startup.bat启动tomcat

![20170719230516781][]

运行成功后访问localhost:8080

![20170719230816996][]

然后在webapp目录下新建一个Nginx目录并在该目录下创建一个index.jsp和一个img目录，如下所示:

![20170910182858518][]

index.jsp文件中的内容如下:

<%@ page language="java" contentType="text/html; charset=utf-8"
    	pageEncoding="utf-8"%>
    <!DOCTYPE html>
    <body>
    <h2>Nginx动静分离</h2>
    <%  
            out.println("["+request.getLocalAddr()+":" +request.getLocalPort()+"]" + "<br/>session id:" + session.getId());   
    %> 
    <br/>
    <img alt="图片" src="/Nginx/img/1.jpg" style="width:300px;height:300px">
    </body>
    </html>

然后访问:  [http://localhost:8080/Nginx/][http_localhost_8080_Nginx]

![20170910183110766][]

**五·、配置Nginx动静分离**

修改nginx/conf/nginx.conf文件为如下所示:

#user  nobody;
    worker_processes  2;
    
    #error_log  logs/error.log;
    #error_log  logs/error.log  notice;
    #error_log  logs/error.log  info;
    
    #pid        logs/nginx.pid;
    
    
    	events {
    		worker_connections  1024;
    	}
    
    
    	http{
    				
    			#access日志存放地址
    			access_log  G:/Developer/nginx-1.12.1-jsp/logs/access.log;
    
    			#配置代理
    			upstream mynginx{
    					 server 127.0.0.1:8080;
    			}
    
    			server{
    					listen 80;
    					server_name 127.0.0.1;
    					charset    utf-8; #设置编码为utf-8;
    
    
    				location / {
    						root   G:/Developer/nginx-1.12.1-jsp/webapps;  
    						index  index.html index.htm; 
    				}
    				
    				# 所有动态请求都转发给tomcat处理  
    				location ~ \.(jsp|do)$ {  
    						proxy_next_upstream http_502 http_504 error timeout invalid_header;
    						proxy_pass http://mynginx;
    				}  
    				
    				#静态文件交给nginx处理
    				location ~ .*\.(htm|html|gif|jpg|jpeg|png|bmp|swf|ioc|rar|zip|txt|flv|mid|doc|ppt|pdf|xls|mp3|wma)$
    				{
    						root  G:/Developer/nginx-1.12.1-jsp/webapps;
    				}
    				#静态文件交给nginx处理
    				location ~ .*\.(js|css)?$
    				{
    						root G:/Developer/nginx-1.12.1-jsp/webapps;
    				}
    				error_page   500 502 503 504  /50x.html;  
    
    				location = /50x.html {
    					root   html;
    				}
    
    		   }
    	}

然后通以下命令重启nginx

.\nginx.exe -s reload

通过nginx访问tomcat

![20170910183548747][]

可以访问，说明配置的nginx生效了，但是图片没有显示，这是由于静态的文件交由nginx处理了，所以在上面配置的路径下新建文件夹:Nginx/img，然后把图片复制到该目录下就行了

![20170910183854329][]

然后从新访问该地址，就能成功的显示了!

![20170910183939833][]

[20170719220811281]: /images/20220612/8ac9fb8c9bbd490eb8f203547bf29339.png
[http_nginx.org]: http://nginx.org/
[20170719221129846]: /images/20220612/227a793beb864a619073ac0300514be6.png
[20170719221410720]: /images/20220612/339535a7d7c04fedbb10c5d29ca9e41f.png
[20170719221752041]: /images/20220612/85bf0532a40044cab6a92ca8d762f6e2.png
[http_tomcat.apache.org_index.html]: http://tomcat.apache.org/index.html
[20170719223947636]: /images/20220612/f89b970df1b8446386e16110d1c5c791.png
[20170719230215496]: /images/20220612/9892bef2709f47a8b9e1ec2dc111af8e.png
[20170719230435624]: /images/20220612/95683879290d4bcf900f43f8cc47706a.png
[20170719230516781]: /images/20220612/8e4064b3560044c8a36a6b94d21ff415.png
[20170719230816996]: /images/20220612/5ea061511b24479f9661b2bddf844d69.png
[20170910182858518]: /images/20220612/47a67ae385754738b64bb0948fb404a8.png
[http_localhost_8080_Nginx]: http://localhost:8080/Nginx/
[20170910183110766]: /images/20220612/3243c32522f949d2aba2d3329a14047d.png
[20170910183548747]: /images/20220612/664ff2e7182a4e6a801b6d92173e555f.png
[20170910183854329]: /images/20220612/febe491e912149cda12d28be39c5d71e.png
[20170910183939833]: /images/20220612/e5a3bd3c727048dfb6f34b68083e92f5.png