当前位置：首页 > article >正文

6. Nginx 动静分离配置案例(附有详细说明+配图)

article 2025/3/4 2:41:42

6. Nginx 动静分离配置案例(附有详细说明+配图)

文章目录

6. Nginx 动静分离配置案例(附有详细说明+配图)
1. 动静分离概述说明
2. 先使用传统方式实现，不使用 Nginx
3. 使用上 Nginx 实现动静分离优化步骤
4. 最后：

1. 动静分离概述说明

什么是动静分离：

Nginx 动静分离简单来说就是把动态跟静态请求分开，可以理解成使用 Nginx 处理静态页面/资源，Tomcat 处理动态页面/资源。

动静分离可以减轻 Tomcat 压力，静态请求由 Nginx 处理，提供系统整体性能。

示意图：

在这里插入图片描述

需求说明：图解

访问: www.rainbowseacrm.com/search/cal.jsp ，其中的 jsp 的文件内容上的图片，静态资源的获取内容集，将静态资源放入到 Nginx 当中，提升加载速度内容。
在这里插入图片描述

动静配置-思路分析 / 图解

示意图：

在这里插入图片描述

2. 先使用传统方式实现，不使用 Nginx

创建 tomcat\webapps\search\cal.jsp

[root@localhost search]# vim cal.jsp

在这里插入图片描述

<%@ page contentType="text/html;charset=UTF-8" language="java"   %>
<html>
<head>
<title>hello, jsp</title> </head>
<body>
<img src="image/cal.jpg"/> <h1>JSP, 计算器</h1>
<%
int i = 20;
int j = 70;
int res = i + j;
out.println(i + " + " + j + " = " + res);
%>
</body>
</html>

cal.jpg 到 tomcat\webapps\search\image

[root@localhost search]# mkdir image # 在 search 目录下创建 image 目录

在这里插入图片描述

浏览器访问 http://www.rainbowseacrm.com/search/cal.jsp 就可以看到正确页面

在这里插入图片描述

3. 使用上 Nginx 实现动静分离优化步骤

使用浏览器的网络工具，进行一个查看，我们捕获到的 cal.jpg 的请求的路径信息

在这里插入图片描述

修改 安装目录conf\nginx.conf 配置

这里我的 nginx.conf 路径是在 /usr/local/nginx/conf 路径下。

在这里插入图片描述

      server 192.168.76.162:8080;
 37         server 192.168.76.162:8081;
 38 
 39     }
 40 
 41     server {
 42         listen       80;
 43         server_name 192.168.76.162;
 44        #server_name  localhost;
 45         #charset koi8-r;
 46 
 47         #access_log  logs/host.access.log  main;
 48         
 49         location /search/image/ {
 50             root /usr/local/nginx/html;
 51         }
 52         location / {
 53             root   html;
 54             proxy_pass http://rsservers;
 55             index  index.html index.htm;
 56         }
 57

在这里插入图片描述

**创建 /usr/local/nginx/html/search/image 目录，因为图片路径其实是 ip/search/image **

mkdir search

cd search

mkdir image

在这里插入图片描述

将 cal.jpg 图片放入到/usr/local/nginx/html/search/image 目录路径下。

在这里插入图片描述

将Linux的Tomcat 当中的 Tomcat\webapps\search\image目录删除 ，防止不走 Nginx 产生误导。

[root@localhost search]# ls
cal.jsp  image  look.html
[root@localhost search]# pwd
/opt/tomcat/apache-tomcat-8.5.59/webapps/search
[root@localhost search]# rm -r image
rm: descend into directory ‘image’? y
rm: remove regular file ‘image/cal.jpg’? y
rm: remove directory ‘image’? y
[root@localhost search]# ls
cal.jsp  look.html
[root@localhost search]#