Nginx之动静分离
nginx的反向代理，我想大家应该了解，前端nginx代理后端的tomcat，但是在处理静态资源（相关图片等）上tomcat并不占优势。所以动静分离利用nginx的location匹配，使静态资源自己处理，或者交由其他服务器处理，动态资源交给tomcat处理。这样带来的好处是加快了网站的访问速度，减轻后端压力，并且在后台tomcat宕机时，静态资源并不受影响。
环境：三台主机
192.168.0.18 proxy代理主机nginx
192.168.0.25 解析动态资源tomcat
192.168.0.102 解析静态资源nginx
一、动态资源tomcat配置
tomcat安装不在赘述，主要修改访问页面
路径： /usr/local/tomcat8/webapps/ROOT
vim index.jsp #代码内容如下，直接复制即可。
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<HTML>
<HEAD>
<TITLE>JSP Test Page</TITLE>
</HEAD>
<BODY>
<%
Random rand = new Random();
out.println("随机数:");
out.println(rand.nextInt(1000)+100);
%>
% </BODY>
% </HTML
访问页面内容如下
二、静态资源解析nginx配置
安装nginx不在赘述，主要修改nginx.conf
1、在默认server中添加如下location，匹配静态资源
location ~ .*\.(gpg|png|css|jpg) {
root /usr/local/nginx/static;
}
2、创建对应目录
mkdir /usr/local/nginx/static
在该目录中放一张测试图片即可，图片尾缀要和配置文件中匹配
3、重启nginx，访问页面
V_CC(6G@RTNA_5QWO@17(R5.png
三、proxy代理nginx配置
搭建nginx不在赘述，主要修改主配置文件
这样访问192.168.0.18/test.jpg 和192.168.0.18/index.jsp时会代理不同的后端主机进行解析。
vim /usr/local/nginx/conf/nginx.conf
gzip on;
#增加upstream模块
upstream tomcat_server {
server 192.168.0.25:8080;
}
upstream static_server {
server 192.168.0.102;
}
#修改默认server的中配置
server {
listen 80;
server_name localhost;
location / {
root html;
index index.html;
} #匹配到http://ip/.jpg或者.png或者*.css时，交由静态资源服务器102处理 location ~ ..(jpg|png|css) { proxy_pass http://static_server; proxy_set_header X-Real-IP $remote_addr; } #匹配到http://ip/.jsp时，交由后台tomcat处理动态资源 location ~ .*.jsp$ { proxy_pass http://tomcat_server; proxy_set_header X-Real-IP $remote_addr; } error_page 500 502 503 504 /50x.html; location = /50x.html { root html; } } BM`V1KMR~1NPIJ$G79VU8FI.png
I3%850[~S(_)SS_5QE$%(T3.png
四、整合动态和静态资源（proxy代理nginx）
vim /usr/local/nginx/html/index.html
<html> <head> <meta charset="UTF-8" /> <title>测试ajax和跨域访问</title> <script src="http://libs.baidu.com/jquery/2.1.4/jquery.min.js"></script> </head> <script type="text/javascript"> $(document).ready(function(){ $.ajax({ type: "GET", #添加proxy主机代理的动态资源 url: "http://192.168.0.18/index.jsp", success: function(data) { $("#get_data").html(data) }, error: function() { alert("fail!!,请刷新再试!"); } }); }); </script> <body> 测试动静分离 #添加proxy主机代理的静态资源 <img src="http://192.168.0.18/test.jpg"> <div id="get_data"></div> </body> </html> 访问效果如下：
AWVL$83YFNW4QMXA)900C5K.png
总结：动静分离原理实际上是使用了nginx的location正则匹配，这样即使动态资源宕机，也不影响静态资源使用，而且增加访问效率。
