前端可以了解一下:nginx负载均衡

简介: 直接封面图可以发现:最左侧的便是客户机,中间的就是负载均衡的机器,最右侧的便是通过负载后真正访问的服务器,我这里只画了两台服务器,实际情况根据需求可能还会不断增加。

image.png


前言:大家好,我是 那个曾经的少年回来了。10年前我也曾经年轻过,如今已步入被淘汰的年龄,但如下幡然醒悟,所以活在当下,每天努力一点点,来看看2024年的时候自己会是什么样子吧,2024年的前端又会是什么样子,而2024年的中国乃至全球又会变成什么样子,如果你也有想法,那还不赶紧行动起来。期待是美好的,但是更重要的是要为美好而为之奋斗付诸于行动。


直接封面图可以发现:最左侧的便是客户机,中间的就是负载均衡的机器,最右侧的便是通过负载后真正访问的服务器,我这里只画了两台服务器,实际情况根据需求可能还会不断增加。


1、前端负载均衡实现


  • 先上一个前端版本,同一份打包编译后的文件,分别部署到one和two.


  • 因为我只有一台服务器,所以这里通过端口进行演示: one对应端口91,two对应端口92.


  • 通过upstream nginxlbdemo进行负载配置.


  • 最后通过proxy_pass反向代理 upstream.


  • 如果有修改nginx的配置文件,修改完毕后记得 nginx -s reload


nginx-lb.conf可以放到/etc/nginx/conf.d路径下


upstream nginxlbdemo{
    server 127.0.0.1:91;
    server 127.0.0.1:92;
}
server {
    listen 90;
    location / {
      proxy_pass http://nginxlbdemo;
    } 
}
server {
    listen 91;
    root /usr/local/aehyok/nginx-lb/one;
    index index.html index.htm;
    if ($request_method = 'OPTIONS') {
        return 204;
    }
    location / {
      try_files $uri $uri/ = 404;
    } 
}
server {
    listen 92;
    root /usr/local/aehyok/nginx-lb/two;
    index index.html index.htm;
    if ($request_method = 'OPTIONS') {
        return 204;
    }
    location / {
      try_files $uri $uri/ = 404;
    } 
}


部署完毕后,通过电脑查看,我没办法做测试,只能通过停掉91或者停掉92来访问90,都是没问题的。 那这里只好通过node开启后端服务来测试一下。


2、node后端负载均衡


下面的代码算算是模拟91和92两个端口,相当于两台服务器,拷贝到linux服务器上,通过 node index.js运行起来


const http = require("http");
const port1 = 91
const server1 = http
  .createServer(function (req, res) {
    console.log(`Request: ${req.url}--port ${port1}`);
    res.end(`hello world! - ${port1}`);
  })
  .listen(port1, "127.0.0.1");
server1.once("listening", () => {
  console.log(`Server http://127.0.0.1:${port1}`);
});
const port2 = 92
const server2 = http
  .createServer(function (req, res) {
    console.log(`Request: ${req.url}--port ${port2}`);
    res.end(`hello world! - ${port2}`);
  })
  .listen(port2, "127.0.0.1");
server2.once("listening", () => {
  console.log(`Server http://127.0.0.1:${port2}`);
});


然后重新配置nginx-lb.conf,然后  nginx -s reload


upstream nginxlbdemo{
    server 127.0.0.1:91;
    server 127.0.0.1:92;
}
server {
    listen 90;
    location / {
      proxy_pass http://nginxlbdemo;
    } 
}


然后通http://139.159.245.209:90 ,你可以不断的刷新,就可以看到node 后台的请求日志 91和92端口在不停的切换


image.png

image.png


3、负载均衡的分类


3.1、默认轮询


nginx默认就是轮询,其权重默认都是1,服务器请求的顺序:


  • 第1个请求 91端口
  • 第2个请求 92端口
  • 第3个请求 91端口
  • 第4个请求 92端口
  • 第5个请求 91端口
  • 第6个请求 92端口
  • 第7个请求 91端口
  • 第8个请求 92端口 ....


upstream nginxlbdemo{
    server 127.0.0.1:91; 
    server 127.0.0.1:92;  
}


3.2、 加权轮询


nginx根据配置的权重大小而分发给对应服务器对应权重 数量的其你,其权重默认都是1,服务器请求的顺序:


  • 第1个请求 91端口
  • 第2个请求 92端口
  • 第3个请求 92端口
  • 第4个请求 91端口
  • 第5个请求 92端口
  • 第6个请求 92端口
  • 第7个请求 91端口
  • 第8个请求 92端口
  • 第9个请求 92端口


upstream nginxlbdemo{
    server 127.0.0.1:91 weight=1;
    server 127.0.0.1:92 weight=2; 
}


3.3、 ip_hash


nginx 会让相同的客户端ip请求相同的服务器。


upstream nginxlbdemo{
    ip_hash;
    server 127.0.0.1:91;
    server 127.0.0.1:92; 
}


3.4、 热备


开始时负载均衡90只会访问91端口,如果91端口服务器发生故障,才会开启第二台服务器给提供服务。


upstream nginxlbdemo{
    ip_hash;
    server 127.0.0.1:91;
    server 127.0.0.1:92 backup; 
}


4、总结


nginx在后端非常的常见,但对于一向爱折腾的我有必要去学习一下。了解完以后。便可以发现,灰度发布其实就可以通过加权轮询来处理,当然nginx的体系还是非常庞大的继续学习吧。


我的个人博客:vue.tuokecat.com/blog


我的个人github:github.com/aehyok


我的前端项目:pnpm + monorepo + qiankun + vue3 + vite3 + 工具库、组件库 + 工程化 + 自动化


不断完善中,整体框架都有了


在线预览:vue.tuokecat.com


github源码:github.com/aehyok/vue-…

相关实践学习
部署高可用架构
本场景主要介绍如何使用云服务器ECS、负载均衡SLB、云数据库RDS和数据传输服务产品来部署多可用区高可用架构。
负载均衡入门与产品使用指南
负载均衡(Server Load Balancer)是对多台云服务器进行流量分发的负载均衡服务,可以通过流量分发扩展应用系统对外的服务能力,通过消除单点故障提升应用系统的可用性。 本课程主要介绍负载均衡的相关技术以及阿里云负载均衡产品的使用方法。
目录
相关文章
|
4天前
|
负载均衡 算法 应用服务中间件
面试题:Nginx有哪些负载均衡算法?Nginx位于七层网络结构中的哪一层?
字节跳动面试题:Nginx有哪些负载均衡算法?Nginx位于七层网络结构中的哪一层?
49 0
|
4天前
|
前端开发 应用服务中间件 nginx
Nginx配置详解Docker部署Nginx使用Nginx部署vue前端项目
Nginx配置详解Docker部署Nginx使用Nginx部署vue前端项目
167 0
|
4天前
|
负载均衡 应用服务中间件 API
Nginx配置文件详解Nginx负载均衡Nginx静态配置Nginx反向代理
Nginx配置文件详解Nginx负载均衡Nginx静态配置Nginx反向代理
45 4
|
4天前
|
前端开发 JavaScript 应用服务中间件
前端vue2、vue3去掉url路由“ # ”号——nginx配置(二)
前端vue2、vue3去掉url路由“ # ”号——nginx配置
66 0
|
3天前
|
负载均衡 应用服务中间件 nginx
解决nginx配置负载均衡时invalid host in upstream报错
在Windows环境下,配置Nginx 1.11.5进行负载均衡时遇到问题,服务无法启动。错误日志显示“invalid host in upstream”。检查发现上游服务器列表中,192.168.29.128的主机地址无效。负载均衡配置中,两个服务器地址前误加了"http://"。修正方法是删除上游服务器列表和proxy_pass中的"http://"。问题解决后,Nginx服务应能正常启动。
33 4
解决nginx配置负载均衡时invalid host in upstream报错
|
4天前
|
负载均衡 网络协议 应用服务中间件
【亮剑】在Linux中构建高可用性和高性能网络服务的负载均衡工具HAProxy、Nginx和Keepalived。
【4月更文挑战第30天】本文介绍了在Linux中构建高可用性和高性能网络服务的负载均衡工具HAProxy、Nginx和Keepalived。HAProxy是一个高性能的开源TCP和HTTP负载均衡器,适合处理大量并发连接;Nginx是一个多功能Web服务器和反向代理,支持HTTP、HTTPS和TCP负载均衡,同时提供缓存和SSL功能;Keepalived用于监控和故障切换,通过VRRP实现IP热备份,保证服务连续性。文中详细阐述了如何配置这三个工具实现负载均衡,包括安装、配置文件修改和启动服务,为构建可靠的负载均衡系统提供了指导。
|
4天前
|
负载均衡 算法 网络协议
LVS、Nginx和HAProxy负载均衡器对比总结
LVS、Nginx和HAProxy负载均衡器对比总结
|
4天前
|
负载均衡 应用服务中间件 PHP
使用nginx-haproxy实现七层负载均衡
【4月更文挑战第13天】使用nginx实现动静分离的负载均衡集群
38 4
|
4天前
|
负载均衡 应用服务中间件 nginx
Nginx 负载均衡
Nginx 负载均衡
26 2
|
4天前
|
负载均衡 算法 应用服务中间件
解密Nginx负载均衡:实现流量分发与故障转移
解密Nginx负载均衡:实现流量分发与故障转移
29 1