关于Nginx动静分离详解以及配置

1.Nginx动静分离概念

动静分离,通过中间件将动态请求和静态请求进行分离,分离资源,减少不必要的请求消耗,减少请求延时。

好处:动静分离后,即使动态服务不可用,但静态资源不会受到影响

通过中间件可以将动态请求和静态请求进行分离

在这里插入图片描述

2.Nginx动静分离应用案例

在这里插入图片描述

2.1.环境规划

系统 服务 服务 地址
centos7.5 负载均衡 Nginx proxy 192.168.81.210
centos7.5 静态资源 Nginx static 192.168.81.220
centos7.5 动态资源 Tomcat server 192.168.81.230

2.2.配置静态资源

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
1.创建动静分离配置文件
[root@localhost ~]# cd /etc/nginx/conf.d/
[root@localhost conf.d]# vim ds.conf
#动静分离
server {
    listen 80;
    server_name ds.com;
     
    location / {
        root /web;
        index index.html;
    }
     
    location ~* .*.(png|jpg|gif)$ {
        root /web/images;
    }
}
 
2.重载Nginx
[root@localhost conf.d]# nginx -t
nginx: the configuration file /etc/nginx/nginx.conf syntax is ok
nginx: configuration file /etc/nginx/nginx.conf test is successful
[root@localhost conf.d]# systemctl reload nginx
 
3.准备图片
[root@localhost conf.d]# mkdir /web/images
[root@localhost conf.d]# wget -O /web/images/nginx.png http://nginx.org/nginx.png

在这里插入图片描述

2.3.配置动态资源

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
1.编译安装tomcat
[root@localhost soft]# tar xf apache-tomcat-7.0.92.tar.gz  -C /application/
 
2.写入动态文件
[root@localhost soft]# cd /application/
[root@localhost application]# vim apache-tomcat-7.0.92/webapps/ROOT/java_test.jsp
 
 
     
        <title>JSP Test Page</title>Random number:");
        out.println(rand.nextInt(99)+100);
      %>
     
 
 
3.启动服务
[root@localhost application]# cd apache-tomcat-7.0.92/
[root@localhost apache-tomcat-7.0.92]# ./bin/startup.sh

2.4.整合动静分离

2.4.1.配置动静分离负载均衡

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
[root@localhost conf.d]# vim lb_ds.conf
#整合动静分离
upstream static_photo {
        server 172.16.1.20:80;
}
 
upstream java {
        server 172.16.1.30:8080;
}
 
server {
        listen 80;
        server_name ds.com;
        access_log /nginx_log/lb_ds_access.log main;
 
        location / {
                root /web/ds;
                index index.html;
        }
 
        location ~* .*.(jpg|png|gif)$ {
                proxy_pass http://static_photo;
                proxy_set_header HOST $http_host;
                proxy_set_header X-Real-IP $remote_addr;
                proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        }
 
        location ~* .jsp$ {
                proxy_pass http://java;
                proxy_set_header HOST $http_host;
                proxy_set_header X-Real-IP $remote_addr;
                proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        }
}

2.4.2.编写整合动静分离代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
[root@localhost conf.d]# vim /web/ds/index.html
 
 
        <title>测试动静分离</title>
$(document).ready(function(){
        $.ajax({
        type: "GET",
        url: "http://ds.com/java_test.jsp",
        success: function(data) {
                $("#get_data").html(data)
        },
        error: function() {
                alert("fail!!,请刷新再试");
        }
        });
});
<h1>测试动静分离</h1>
                <h1>上面为静态图片,下面为动态页面</h1>
                <img decoding="async" src="http://ds.com/nginx.png"><div id="get_data"></div>
        

2.5.效果

看着是一个页面实则不同机器在做处理

在这里插入图片描述

到此这篇关于关于Nginx动静分离详解以及配置的文章就介绍到这了,更多相关Nginx动静分离详解内容请搜索IT俱乐部以前的文章或继续浏览下面的相关文章希望大家以后多多支持IT俱乐部!

本文收集自网络,不代表IT俱乐部立场,转载请注明出处。https://www.2it.club/server/nginx/7806.html
上一篇
下一篇
联系我们

联系我们

在线咨询: QQ交谈

邮箱: 1120393934@qq.com

工作时间:周一至周五,9:00-17:30,节假日休息

关注微信
微信扫一扫关注我们

微信扫一扫关注我们

返回顶部