Nginx专栏—09.Nginx动静分离实战

本文涉及的产品
传统型负载均衡 CLB,每月750个小时 15LCU
网络型负载均衡 NLB,每月750个小时 15LCU
EMR Serverless StarRocks,5000CU*H 48000GB*H
简介: 1.Nginx动静分离基本概述

动静分离, 通过中间件将动静分离和静态请求进行分离。
那为什么要通过中间件将动态请求和静态请求进行分离? 减少不必要的请求消耗, 同时能减少请求的延时。

通过中间件将动态请求和静态请求分离,逻辑图如下

 

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

 

2.Nginx动静分离场景实践

Nginx动静分离实践应用案例

0.环境准备

image.png

1.在10.0.0.7服务器上配置静态资源

[root@web01 conf.d]# cat ds_oldboy.conf
server{
        listen 80;
        server_name ds.oldboy.com;
        root /soft/code;
        index index.html;
        location ~* .*\.(png|jpg|gif)$ {
                root /soft/code/images;
        }
}
# 准备目录, 以及静态相关图片
[root@web01 ~]# mkdir /soft/code/images -p
[root@web01 ~]# wget -O /soft/code/images/nginx.png http://nginx.org/nginx.png
[root@web01 ~]# systemctl restart nginx

2.在10.0.0.8服务器上配置动态资源

[root@web01 ~]# yum install -y tomcat
[root@web01 ~]# mkdir /usr/share/tomcat/webapps/ROOT
[root@web01 ~]# vim /usr/share/tomcat/webapps/ROOT/java_test.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("<h1>Random number:</h1>");
        out.println(rand.nextInt(99)+100);
      %>
    </BODY>
</HTML>
#重启tomcat服务
[root@web01 ~]# systemctl start tomcat

3.在负载均衡10.0.0.5上配置调度, 实现访问jsppng

root@lb01 conf.d]# cat ds_proxy.conf 
upstream static {
        server 10.0.0.7:80;
}
upstream java {
        server 10.0.0.8:8080;
}
server {
        listen 80;
        server_name ds.oldboy.com;
        location / {
                root /soft/code;
                index index.html;
        }
        location ~ .*\.(png|jpg|gif)$ {
                proxy_pass http://static;
                include proxy_params;
        }
        location  ~ .*\.jsp$ {
                proxy_pass http://java;
                include proxy_params;
        }
}
[root@lb01 conf.d]# systemctl restart nginx

4.通过负载测试访问静态资源

5.通过负载测试访问动态资源

6.在负载均衡10.0.0.5上整合动态和静态资源的html文件

[root@lb01 ~]# mkdir /soft/code -p
[root@lb01 ~]# cat /soft/code/index.html
<html lang="en">
<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",
        url: "http://ds.oldboy.com/java_test.jsp",
        success: function(data) {
                $("#get_data").html(data)
        },
        error: function() {
                alert("fail!!,请刷新再试!");
        }
        });
});
</script>
        <body>
                <h1>测试动静分离</h1>
                <img src="http://ds.oldboy.com/nginx.png">
                <div id="get_data"></div>
        </body>
</html>

7.测试动态和静态资源是否能正常加载在一个html文件中

8.当使用systemctl stop nginx停止Nginx后, 会发现静态内容无法访问, 动态内容依旧运行正常

9.当使用systemctl stop tomcat停止tomcat后, 静态内容依旧能正常访问, 动态内容将不会被请求到

3.Nginx资源分离场景实践

Nginx通过负载均衡实现手机与PC调度至不同的后端节点应用案例

1.根据iphone、安卓、pc跳转不同的页面环境规划

image.png

2.配置后端WEB节点的Nginx配置

[root@web01 conf.d]# cat sj.conf 
server {
    listen 9090;
    location / {
        root /code/android;
        index index.html;
    }
}
server {
    listen 9091;
    location / {
        root /code/iphone;
        index index.html;
    }
}
server {
    listen 9092;
    location / {
        root /code/pc;
        index index.html;
    }
}

2.为后端WEB节点配置对应的网站目录以及代码

[root@web01 conf.d]# mkdir -p /code/{android,iphone,pc}
[root@web01 conf.d]# echo "PC" > /code/pc/index.html
[root@web01 conf.d]# echo "Iphone" > /code/iphone/index.html
[root@web01 conf.d]# echo "Android" > /code/android/index.html
#检查语法并重载Nginx服务
[root@web01 conf.d]# nginx -t
[root@web01 conf.d]# systemctl restart nginx

2.配置负载均衡服务,根据不同的浏览器调度到不同的资源池

[root@lb01 conf.d]# cat sj_proxy.conf 
upstream iphone {
    server 172.16.1.7:9091;
}
upstream android {
    server 172.16.1.7:9090;
}
upstream pc {
    server 172.16.1.7:9092;
}
server {
    listen 80;
    server_name sj.oldboy.com;
    location / {
    #默认跳转至pc站点
    proxy_pass http://pc;
    include proxy_params;
        #如果客户端是Iphone则跳转到iphone的资源池
        if ($http_user_agent ~* "Iphone") {
            proxy_pass http://iphone;
        }
        #如果客户端是Android则跳转到android的资源池
        if ($http_user_agent ~* "Android"){
            proxy_pass http://android;
        }
        #如果客户端是IE浏览器,则返回403错误。
        if ($http_user_agent ~* "msie"){
            return 403;
        }
    }
}

3.直接使用浏览器访问,返回默认的结果

4.如果通过android设备访问,效果如下。

4.如果通过Iphone设备访问,效果如下。

相关实践学习
SLB负载均衡实践
本场景通过使用阿里云负载均衡 SLB 以及对负载均衡 SLB 后端服务器 ECS 的权重进行修改,快速解决服务器响应速度慢的问题
负载均衡入门与产品使用指南
负载均衡(Server Load Balancer)是对多台云服务器进行流量分发的负载均衡服务,可以通过流量分发扩展应用系统对外的服务能力,通过消除单点故障提升应用系统的可用性。 本课程主要介绍负载均衡的相关技术以及阿里云负载均衡产品的使用方法。
相关文章
|
6月前
|
运维 监控 应用服务中间件
LNMP详解(十五)——Nginx日志分析实战
LNMP详解(十五)——Nginx日志分析实战
74 0
|
6月前
|
运维 应用服务中间件 Linux
keepalived详解(三)——keepalived与Nginx配合实战
keepalived详解(三)——keepalived与Nginx配合实战
207 1
|
1月前
|
缓存 负载均衡 安全
Nginx常用基本配置总结:从入门到实战的全方位指南
Nginx常用基本配置总结:从入门到实战的全方位指南
256 0
|
4月前
|
应用服务中间件 nginx
Nginx Location 深入剖析及动静分离简易配置
Nginx Location 深入剖析及动静分离简易配置
71 3
|
5月前
|
Ubuntu 前端开发 JavaScript
技术笔记:Ubuntu:一个部署好的tomcat应用(war包)怎么用Nginx实现动静分离?
技术笔记:Ubuntu:一个部署好的tomcat应用(war包)怎么用Nginx实现动静分离?
|
4月前
|
存储 缓存 前端开发
(三)Nginx一网打尽:动静分离、压缩、缓存、黑白名单、跨域、高可用、性能优化...想要的这都有!
早期的业务都是基于单体节点部署,由于前期访问流量不大,因此单体结构也可满足需求,但随着业务增长,流量也越来越大,那么最终单台服务器受到的访问压力也会逐步增高。时间一长,单台服务器性能无法跟上业务增长,就会造成线上频繁宕机的现象发生,最终导致系统瘫痪无法继续处理用户的请求。
145 1
|
5月前
|
前端开发 Java 应用服务中间件
若依分离板nginx配置
若依分离板nginx配置
431 1
|
5月前
|
安全 Ubuntu 应用服务中间件
NGINX环境下实现Web网站访问控制的实战指南
在NGINX中设置基于IP的访问控制可提升网站安全性。步骤包括安装NGINX、备份配置文件、编辑`/etc/nginx/sites-available/default`,添加`allow`和`deny`指令限制特定IP访问,如`allow 192.168.1.100; deny all;`,然后测试配置并重启服务。成功后,仅允许的IP能访问网站,否则会收到403错误。这为Web安全提供基础保障,还可扩展实现更多高级控制策略。【6月更文挑战第20天】
614 3
|
5月前
|
弹性计算 应用服务中间件 Linux
双剑合璧:在同一ECS服务器上共存Apache与Nginx的实战攻略
在ECS服务器上同时部署Apache和Nginx的实战:安装更新系统,Ubuntu用`sudo apt install apache2 nginx`,CentOS用`sudo yum install httpd nginx`。配置Nginx作为反向代理,处理静态内容及转发动态请求到Apache(监听8080端口)。调整Apache的`ports.conf`监听8080。重启服务测试,实现两者高效协同,提升Web服务性能。记得根据流量和需求优化配置。【6月更文挑战第21天】
524 1
|
5月前
|
监控 前端开发 应用服务中间件
前端开发者必备:Nginx入门实战宝典,从部署到优化一网打尽(2)
前端开发者必备:Nginx入门实战宝典,从部署到优化一网打尽
84 1