经常会遇到面试时有人问,从地址栏输入URL到页面加载完成发生了什么?这是一道开放题,考察综合能力,如果真摊开讲,三天三夜也未必说的完。这里把主要流程写下,供参考。

主要过程

  1. 解析用户输入
  2. DNS解析
  3. TCP连接
  4. 发送HTTP请求
  5. 如果是HTTPS,还涉及加密和证书
  6. 服务器收到请求开始处理
  7. 处理完毕,将结果发回
  8. 收到响应
  9. 开始渲染页面(包含加载CSS、JS、图片等一系列资源)

详细解析

解析URL

首先浏览器要对用户的输入进行解析,确定下一步的执行步骤。比如直接输入的是IP,会跳过DNS解析这一步。还有一些特殊的、浏览器内部定义的地址,如about:blank,chrome://settings/这种。

最常见的是输入一个域名,如wzzcn.net,这种不是一个完整的URL,但是浏览器足够智能

DNS解析

根节点服务器

CDN

负载均衡

发送HTTP请求

中间人攻击

正向代理

有些大公司会在内网部署代理服务器,控制员工上网。有的会在这个服务器上配置缓存,优化内网访问速度。

CDN层

CDN的全称是(Content Delivery Network),即内容分发网络。其目的是通过在现有的Internet中增加一层新的CACHE(缓存)层,将网站的内容发布到最接近用户的网络”边缘“的节点,使用户可以就近取得所需的内容,提高用户访问网站的响应速度。从技术上全面解决由于网络带宽小、用户访问量大、网点分布不均等原因,提高用户访问网站的响应速度。
简单的说,CDN的工作原理就是将您源站的资源缓存到位于全球各地的CDN节点上,用户请求资源时,就近返回节点上缓存的资源,而不需要每个用户的请求都回您的源站获取,避免网络拥塞、缓解源站压力,保证用户访问资源的速度和体验。

哪个节点是最近的?用户是不知道,浏览器也不知道,对于浏览器而言,有没有CDN都一样。在DNS解析的时候,DNS就会根据请求来源返回适合的节点IP,从而达到提升速度的目的。因此CDN不是单独的一个逻辑层,而是一系列技术的合集。

CDN节点收到请求之后,会从缓存中查到匹配,如果存在匹配,直接返回结果。如果缓存里找不到,会请求源站服务器,寻找对应资源,然后再返回给用户,这一步叫回源。有些CDN服务商要求将内容预先推送到CDN节点上,而不是通过回源的方式来获取所需内容。

CDN加速静态内容效果是很好的,响应速度很快。对动态内容也可以加速,由于CDN节点的网络一般好于终端用户的网络,从用户=》CDN=》源站,速度会由于用户直接请求源站,特别是路由情况下不太好的情况。

节点如何决定是否缓存资源和缓存多久,一般是根据源站返回的Cache-Control策略,以及配置。所以如果动态内容没处理好,返回了不合适的Cache-Control,可能会导致问题。

近些年又出现了PCDN,其实就是利用智能设备的带宽,在网络边缘布置节点,没有本质的区别。

CDN的优化和排查

  1. 预热,预热是指预先把资源推送节点上,优化体验和避免回源高峰。
  2. 缓存,有时候更新代码后,发现访问的还是老的文件。这时候可以通过刷新CDN的方式,清空CDN的缓存。另外,静态文件应该带上版本号或者hash值,很多打包工具能帮我们实现这一步。
  3. 加速效果不明显,CDN是通过域名解析来工作,需要查看网络环境,是否本地网络把DNS缓存太久,或者指向了不恰当的服务器。

服务器收到请求开始处理

反向代理层

反向代理(Reverse Proxy)方式是指以代理服务器来接受Internet上的连接请求,然后将请求转发给内部网络上的服务器,并将从服务器上得到的结果返回给Internet上请求连接的客户端,此时代理服务器对外就表现为一个服务器。反向代理可以是TCP层(4层),也可以是HTTP层(7层),这里我们讨论HTTP层的反向代理,TCP层能做的事情相对简单些。下面大部分概述以nginx为例。其他haproxy,lvs也是反向代理,和nginx相比,他们专注于负载均衡,其他功能比较少。再如阿里云的SLB也是反向代理。

从这里开始,我们可以对请求做很多事情。负载均衡;缓存;资源分离,把静态资源、接口、WebSocket单独部署;流量复制;日志记录;简单逻辑处理;IP限制;

负载均衡是反向代理最常用的模式,反向代理把请求按照一定策略均摊到后端服务器上,由于反向代理的承载量远高于后端服务器,这种模式能承载很高的并发(但也是有上限的)。

我们之前要访问微信的图片,但是微信做了防盗链,就用Nginx作为反向代理,抓取微信图片,并且缓存下来,提升速度。

反向代理是很有用的,但是也有个弱点:存在单点,一旦反向代理出现故障,整个集群都没用了。所以在此基础上又有HA高可用。

高可用

如果有人说双机热备,那他一般再说高可用。虽说nginx等反向代理一般比较稳定,不容易挂,但难保哪天需要软件升级、硬件维护、意外挂了,这时候只有一个节点根本无法维护。所以追求高可用的服务器都会做多机热备,目的是一台机器挂了的时候,备份机器能立刻顶上。

IP伪造

可以伪造,难度大,且收不到报文。

后端服务器开始处理

如果是静态文件,一般是直接返回,也可以对静态文件做些改动,如自动裁剪,自动压缩。

如果是动态脚本,如PHP、Node、Java,情况比较复杂。以PHP为例,分为这么几步

  1. 脚本引擎解析HTTP请求,做好初始化工作
  2. 引擎开始执行脚本,这里处理相关逻辑,如查询数据库
  3. 生成返回结果,响应正文、header、cookies

Cache-Control

https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Caching_FAQ
https://imweb.io/topic/5795dcb6fb312541492eda8c

数据库查询

  1. 客户端发送一条查询给服务器。
  2. 服务器先检查查询缓存,如果命中了缓存,则立刻返回存储在缓存中的结果。否则进入下一阶段。
  3. 服务器端进行SQL解析、预处理,再由优化器生成对应的执行计划。
  4. MySQL根据优化器生成的执行计划,再调用存储引擎的API来执行查询。
  5. 将结果返回给客户端。