likes
comments
collection
share

从浏览器输入URL到页面显示前,有哪些背后的服务器

作者站长头像
站长
· 阅读数 21

不谈浏览器端渲染相关的内容,只介绍前端背后可以有哪些类型的服务器,做了什么。

在请求前端页面时,应用层涉及到的服务器一般有:DNS 服务器、Web 应用服务器、CDN 服务器、Web 应用防火墙、DDoS 高防服务器等,每个类型的服务器都有不同职责。可能还会有作者漏掉或者不知道的应用服务器,欢迎留言评论讨论。

DNS 服务器

当你访问一个网站时候,如果浏览器和本机系统都没有该网站的 DNS 缓存,则会去 DNS 服务器请求获取该网站 IP 地址。

DNS 服务器分为:

  • 根域名服务器。所有域名的结尾都有一个被忽略的点 . 就是根域名;根域名服务器只知道顶级域名服务器的地址。
  • 顶级域名服务器。例如 .com.cn 等;顶级域名服务器只知道权威性域名服务器的地址。
  • 权威性域名服务器。例如 baidu.com 等;负责域名解析到对应服务的 IP 地址。
  • **递归 DNS 服务器。**负责自动化帮你向以上域名服务器查询到网站的具体 IP 地址,有缓存机制。

一般我们说的向 DNS 服务器查询 IP 地址,默认就是向递归 DNS 服务器查询。用户接入到 ISP 供应商(电信、移动等),都会有他们自己的递归 DNS 服务器帮你把分步的查询自动化。

从浏览器输入URL到页面显示前,有哪些背后的服务器

Web 应用服务器

前端静态资源(HTML、CSS、JS 等)一般都会放到 Web 应用服务器上,并通过 HTTP 请求返回内容。浏览器则会根据 HTTP 响应中的 Content-Type (而不是文件扩展名)来选择如何处理该 URL。

从浏览器输入URL到页面显示前,有哪些背后的服务器

常见的 Web 服务器:

  • Nginx。一般用来做静态服务器、反向代理、负载均衡等;性能高,前端最熟悉的服务器,没有之一。
  • Apache。历史悠久,相比 Nginx 性能差一些,对 PHP 有部分的支持。
  • Lighttpd。针对性能进行了优化,性能高,内存占用量小;不过市场占有率很低。
  • IIS。Windows 平台下微软开发的 Web 服务器,一般就 .NET 网站会使用 IIS。
  • OpenResty。基于 Nginx 和 Lua 语言,支持了更多的功能;一般网关的技术选型很多使用该服务器。
  • Node.js Web Server。基于 Node.js,比如 Express、Koa、Egg.js 等。

负载均衡

如果流量较大的网站,则会使用多个 Web 应用服务器组成集群。然后外层使用负载均衡集群专门进行转发和流量的控制,一般也会使用 Nginx。

DNS 首先就是个庞大的分布式集群,一个域名可以配置多个 IP 地址,利用 DNS 服务器则可以作为首层的负载均衡。当浏览器查询 DNS 服务器时,DNS 服务器可以根据策略(轮询或根据 IP 地域)来返回不同的 IP 地址。

CDN 服务器

前端的静态资源请求有个特点是幂等,一般在文件名上会带上文件的哈希值或版本号,如果 URL 不变一般则认为内容不变。

可以配置 Cache-Control 来设置强缓存或 304 缓存静态资源;但首次访问或静态资源更新时,还是会需要去请求 Web 应用服务器(源站)获取内容。

所以没有缓存时,首次资源请求的速度则是由用户的电脑和 Web 应用服务器的物理距离决定的。CDN 服务一般在全国/全球有非常多的服务器节点,如果用户可以请求就近的 CDN 服务器节点,由 CDN 服务器去代理请求源站获取内容并且缓存该文件,之后附近用户的请求就可以直接返回 CDN 服务器上缓存的文件,请求的速度就会加速非常多,文件越大则效果越明显。

CDN 服务之所以可以让用户请求到就近的服务器节点,利用的是 DNS 的 CNAME 记录。在 DNS 服务商上把你网站域名 CNAME 到 CDN 提供的域名,DNS 服务商提供了智能解析功能,会根据用户的 IP 地址返回就近的 CDN 服务器的 IP 地址。

CDN 服务上配置了源站(IP 地址或域名)。可以设置不同 URL 的缓存的时间、自定义一些响应 Header、访问控制、流量控制等等。

如果还想加速第一次请求时的速度,可以使用预取/预热功能,CDN 服务器节点会主动去源站先取得资源文件并缓存,用户请求时则直接返回 CDN 服务器上的缓存内容。

OSS 对象存储服务

可以存储任意类型的数据文件,并提供了 API 来管理文件,提供了 URL 可以访问到具体的文件,很适合保存管理静态资源。

一般 CDN 经常会和 OSS 对象存储服务配合使用,把 CDN 的源站地址指向 OSS 域名地址。所以我们经常说的把静态资源放到 CDN 上,其实指的是把静态资源放到 OSS 上,CDN 不提供直接存储文件的功能。

从浏览器输入URL到页面显示前,有哪些背后的服务器

Web 应用防火墙

简称 WAF(Web Application Firewall),用来保护源站 Web 应用服务器防止被恶意攻击,包括被一些漏洞利用、注入、恶意扫描、CC 攻击等等。

用户的请求经过 WAF 分析如果是正常的请求则会转发到源站,如果是恶意的请求,则会直接拦截。

一般会配合 CDN 服务使用,先把源站点接入 WAF 服务,然后再接入 CDN 服务,资源首次被请求时,到先会 CDN 服务器节点,然后回源请求到 WAF 服务器上,最后再到你自己的 Web 应用服务器上获取内容。

从浏览器输入URL到页面显示前,有哪些背后的服务器

DDoS 高防服务器

专门用来进行 DDoS 攻击防护的服务器。DDoS 攻击会产生大流量的非正常请求,会使 Web 应用服务器、甚至 WAF 服务器因资源耗尽,造成服务中断。

DDoS 高防服务器则可以清洗这些大流量的非正常攻击,把正常的请求转发到对应的源站服务器。

CDN 服务、WAF 服务等一般都会结合 DDoS 高防服务配合使用。

从浏览器输入URL到页面显示前,有哪些背后的服务器

总结

那会经过那么多服务器,会不会特别慢。其实不然,正常用户的请求大部分都会有缓存很快的返回。有 DNS 解析缓存、CDN 缓存,一般只异常的请求才会频繁的去到 Web 应用防火墙、 DDoS 高防服务器。

如果首次访问,本地即没有任何缓存、DNS 也没有缓存、CDN 上也没有缓存。如果该网站配套齐全,那完整的访问链路一般会有:

  • 用户 → DNS 递归服务器(请求各类型 DNS 服务器获取域名 IP )
  • 用户 → CDN 服务器 → WAF 服务器 → 源站 Web 服务器。

互联网发展到现在,已经不太可能不使用云服务来构建一个非常健全的站点了。了解了以上内容,当面试官再问你从浏览器输入URL到页面显示前做了什么,又多了一个角度的内容可以介绍。

参考文章