面试官:作为前端,服务器相关了解多少?

1,101 阅读10分钟

持续创作,加速成长!这是我参与「掘金日新计划 · 6 月更文挑战」的第16天,点击查看活动详情

写在前面

随着程序开发行业技术的不断积累、迭代和更新,逐渐从混合开发转向了前后端分离的开发模式,前端也从卑微的“页面仔”时代进化到如今的框架盛行、工程化日益健壮的时代,前端正在朝着更加专业,更加标准的方向不断迈进,因此,对于如今的前端开发人员的技术要求,也将会越来越高。有一句话说得特别好“凡是能够用JS实现的东西,最终都会用JS来实现”,从目前 JS 以及 JS 相关的框架、库的发展来看,前端的能力圈已经有渗透各个领域的趋势了,这对于前端开发人员提出了非常大的挑战,同时也是非常大的机遇,对于学前端的我们,需要做的,那就是拓宽自己的知识广度,把自己往外拓展,而不是禁锢在前端的小圈子里,当我们了解的东西越来越多,知识广度越来越广的时候,站在更高更广的角度重新看前端的时候,会发现你理解的前端已不止于前端!!

Nginx

什么是 Nginx ,相信大家都有多多少少都有听过,但是准确来说是个什么可能也并不是很了解,准确来说, Nginx 是一个高性能的HTTP和反向代理web服务器,看了更懵了,从一个未知的名词变成一堆未知的名词,接下来我们就来详细解释一下到底什么是 Nginx。

Nginx 主要用来做什么?

Nginx 作为一个服务器中间件,他主要用来搭建 web 相关的服务,在众多的服务器中间件中,Nginx 以其高效和可靠收获一大批忠实 Nginx 粉,据统计,Nginx 是世界上使用最广泛的服务器中间件,像我们熟知的百度、阿里、字节、京东等等大厂,都在大量采用 Nginx 来搭建高可用性的服务器群,以支撑中国这个独步世界的庞大的用户群体。经过庞大数量级的考验后,Nginx 的强大也愈发凸显。

Nginx 反向代理是什么?

我们都看过 Nginx 相关的介绍,知道 Nginx 可以作为反向代理服务器,那么什么是反向代理服务器呢?首先,我们应该先理解,什么是代理以及什么是正向代理

正向代理

代理,顾名思义在这里表达的意思就是代理某个动作,也就是服务器代理了某个行为。而正向代理,可以理解为就是当我想去访问某网站时,通过另外一台主机,间接请求后,返回相关的数据包,可能描述不是很清楚,我们看下图所示

批注 2022-06-16 005253.png 如图,当A主机想要访问B主机时,主机A先将请求发送到正向代理服务器,然后正向代理服务器转发A主机的请求到主机B,最后将主机B的响应包返回到主机A。

举个例子,作为程序员,我们在遇到一些比较偏,或者比较新的技术难题的时候,常常会发现在百度、Bing上很难找到有效的解决方案,那么这个时候,我们就需要到更加广阔的程序员相关社区寻找解决方案,而当我们点开某些相关的外国网站时会发现,我们并不能访问,原因是什么呢,我们国家的防火墙拦截了相关的请求,那么作为抱着学习态度的程序员,这个时候就需要有个梯子,通过梯子来进行代理,实现访问了,也就是 vpn,既然无法直接访问,那么我们就通过“曲线救国”的方式,绕一圈,通过正向代理服务器发起请求,然后最终从正向代理服务器那接收响应数据,这就是正向代理

反向代理

知道了正向代理,那么反向代理又是啥呢?与正向代理相反,反向代理是外部访问内部,通过反向代理服务器进行映射,对外屏蔽真实主机,什么意思呢,看下图解析

批注 2022-06-16 012306.png 如图,当主机A想要访问主机B时,主机B实际上是由许多主机通过负载均衡等方式组合而成的虚拟主机,当主机A发起请求时,实际上请求发送到的是反向代理服务器上,然后这个时候反向代理服务器经过转发,将请求转发到内网其中一台分主机上,获得响应之后,将响应包返回给主机 A。在这个过程中,反向代理对于主机A是完全透明的,主机A并不知道究竟是内网哪台真实主机响应的请求,只知道发出的请求得到了响应而已。

举个例子,当我们平时打开百度搜索内容时,我们所有人访问的都是相同的域名www.baidu.com,而当我们发起搜索的时候,实际上请求会发送到百度服务器群出口的反向代理服务器上,这个时候,反向代理服务器指派一个服务器来处理我们的搜索请求,接着返回相应的结果,这就是反向代理。

Nginx 负载均衡是什么?

当站点日活达到一定数量,服务器性能达到瓶颈的时候,我们就需要考虑采用多台服务器组成服务器集群来支撑站点提供持续性的服务,那么所有服务器都对接到反向代理服务器上后,如何分配请求呢,这个时候,Nginx 的负载均衡就出场了

批注 2022-06-16 014114.png

如图,当主机A/B/C 都向服务器发起请求时,所有请求首先都发送到了反向代理服务器上,接着,反向代理服务器将主机A/B/C 的请求按预设的分配规则进行分配,使所有的请求均衡分配到到服务器集群上的主机上去处理,这样,也就能够有效防止某台服务器被过度压榨,而其他服务器闲着浪费的情况了。

那么,Nginx 是如何分配流量的呢?使用最频繁的主要有3种:

第一种轮询,轮询也是最简单的一种了,当收到请求时,循环分配到每台主机,也就是说,当有两台主机时,那么接受到的第一个请求分配到主机A,第二个请求分配到主机B,第三个请求又重新循环分配到主机A

第二种加权,加权考虑的东西显然更加全面,我们都知道服务器经常会进行升级,维修,更换或者是扩展,因此,每台服务器的性能、状况都不尽相同,那么如果简单地均匀分配流量,可能并不是明智的选择,就像成年人和小孩子,在分配任务上,一定需要按照能力进行分配,把更多的任务分配给工作能力较强的成年人,这样才能够达到集体利益最大化。Nginx 可以通过对每台设备进行权限设置,然后根据权限分配流量,这样就给了服务器管理者更大的决定空间,使得服务器管理者能够从服务器的相对状态来进行更加合理的流量调度,达到更加合理的流量分配

第三种ip_hash,ip_hash 也是相对较为简单的方式,采用 ip_hash 能够使同一用户每次访问的时候,都是同一台服务器做出响应,当涉及到登录状态保存的问题时,由于每次访问都是同一台服务器提供服务,那么也就节省了服务器集群同步相关登录信息的多余步骤了

总结

服务器作为我们项目中非常重要的组成成分,而作为前端,如果只知道接接口,请求数据,渲染页面,没有对服务器相关知识进行了解和掌握,那么在知识广度上的缺失或许会成为某个Bug困住我们的原因,因此,作为前端,并不是说我们需要将服务器、网络等其他相关的东西学得非常深入,而是需要我们掌握这些东西的基础概念和基础用法,给我们分析问题储备更多的“锦囊”,让我们再遇到更加复杂的问题时,能够从更广的维度分析问题,找到问题的关键点,而不是局限在前端中四处碰壁!!

往期好文推荐

面试官:说说从输入 URL 到页面显示到底经历了什么,体现一下你的知识广度

面试官:作为前端,服务器相关了解多少?

面试官:HTTPS 采用的是对称加密还是非对称加密?具体说说其加密过程

面试官:说说 Cookie 和 Token 的区别?

面试官:网络安全了解多少,简单说说?(一)

面试官:网络安全了解多少,简单说说?(二)

面试官:网络安全了解多少,简单说说?(三)

面试官:网络安全了解多少,简单说说?(四)

面试官:网络安全了解多少,简单说说?(五)

面试官:网络安全了解多少,简单说说?(六)

面试官:网络安全了解多少,简单说说?(七)

面试官:网络安全了解多少,简单说说?(八)

浅尝 | 从 0 到 1 Vue 组件库封装

面试官:这么简单的正则表达式都不会?

Webpack 打包类库踩坑

面试官:你就只会 npm run build 吗?(Webpack 配置 Vue+Ts)

面试官:连VuePress都没搭过还说开发过组件库?(VuePress 搭建)

面试官: 连 Vue 视图更新都不会写?(Vue视图更新原理【一】)

面试官: 能不能手写 Vue 响应式?(Vue2 响应式原理【完整版】)

面试官:能不能手写 Vue3 响应式(Vue3 原理解析之响应系统的实现)

JS 优雅之道(JS 代码优化小 Tip)

面试官:你真的会用 SVG 吗? (SVG 应用实战)

面试官:说一下这个Loading动画实现思路 (CSS3 实现 Loading 动画)

JS 扫盲题 ( 面试题梳理系列 (一))

面试官:你确定你说的防抖不是节流吗?( 面试题梳理系列 (二))

面试官:除了 HTTP,你还用过什么通信协议?(Websocket 在数字孪生中的应用)

面试官:你真的理解 Event Loop 吗?( JS 事件循环 )

面试官:v-for 中 key 为什么不能用 index,从原理层面聊聊?

面试官:vue-router 的 hash 与 history 哪个模式会刷新页面?

面试官:说说你平时用过的自适应方案(数字孪生可视化自适应方案)

面试官:说一下如何优化过渡动画(数字孪生可视化过渡动画)

写在最后

博主接下来将持续更新好文,欢迎关注博主哟!!
如果文章对您有帮助麻烦亲点赞、收藏 + 关注和博主一起成长哟!!❤️❤️❤️