浏览器打开一个网页的全流程

浏览器打开一个网页的全流程

简介

互联网日常生活中最为常见的行为便是在浏览器输入一个网址, 然后浏览网页内容, 这样一个简单的行为背后有哪些技术细节呢, 本文将做一些介绍.

全流程可拆分为4个主要步骤

1. 将域名解析为IP地址
2. 与目标主机建立TCP连接 (三次握手)
3. 发送与接受数据
4. 与目标主机断开TCP连接 (四次挥手)

详细介绍

1. 将域名解析为IP地址

IP地址是什么?

IP地址类似于互联网世界中的门牌号, 公网IP地址全球唯一, 其作为互联网设备的标识符, 用来实现不同设备之间的通信.

IPv4和IPv6的区别

• 主要区别: IPv4长度为32 bit, 而IPv6长度为128 bit (能够唯一标识设备的数量大大增加)
• 此外在效率, 安全性和对移动设备的支持上IPv6也更优优势

域名是什么?

互联网中的任何一个设备都可以通过一个公网IP访问, IP地址是数字, 记忆起来很麻烦, 所以就用域名来记忆. 域名的格式类似于hi.test.com, 其从右往左阅读, 最右侧为顶级域名(如.com, .org, .net), 顶级域名由ICANN维护; 次右为二级域名, 表示其他信息, 这些信息还可以继续向左叠加.

为什么使用域名?

• IP地址是一串数字, 不便于记忆, 使用域名易于记忆
• 一个域名可以对应多个IP, 用户在访问时可以被分配到最近的服务器, 同时也可以做负载均衡和容灾

域名解析的简要流程

1. 查询DNS缓存
   1. 浏览器缓存
   2. 操作系统缓存
   3. 路由器缓存
   4. 本地DNS服务器缓存 (例如企业, 学校的局域网DNS服务器)
   5. ISP服务器缓存 (例如中国移动, 中国电信)
2. 查询外部DNS服务器 (由本地DNS服务器或者ISP迭代执行)
   1. 查询根DNS服务器, 获取顶级DNS服务器地址
   2. 查询顶级DNS服务器, 获取NameServer服务器地址
   3. 查询NameServer, 获取DNS解析结果

DNS解析过程中使用UDP协议

浏览器DNS缓存

• chrome: chrome://net-internals/#dns
• edge: edge://net-internals/#dns

操作系统DNS缓存

• Windows: C:\Windows\System32\drivers\etc\hosts
• Linux: /etc/hosts

DNS服务器

操作系统中的DNS配置

• Windows: 控制面板->网络与共享中心->更改适配器设置->属性->Internet协议版本4(TCP/IPv4)->DNS服务器地址
• Linux: /etc/resolv.conf

递归查询和迭代查询

客户端和本地DNS服务器之间是递归, 本地DNS服务器和其他DNS服务器之间是迭代.

2. 与目标主机建立TCP连接 (三次握手)

用日常生活场景来比喻三次握手 (three-way handshake)

1. 客户端->服务器: "我要和你通信"
2. 服务器->客户端: "好的, 现在可以吗?"
3. 客户端->服务器: "没问题, 开始吧"

使用Wireshark抓包

1. 客户端->服务器: [SYN] Seq=0
2. 服务器->客户端: [SYN, ACK] Seq=0 Ack=1
3. 客户端->服务器: [ACK] Seq=1 Ack=1

为什么需要三次握手？

简单来说是为了避免网络拥塞导致的异常情况: 客户端发送连接请求, 该请求在某个节点长时间滞留, 已经失效, 但在服务端接收到后会误认为是新的连接请求, 服务端发出确认后连接就建立了, 但客户端此时并没有发出建立连接的请求, 所以就造成了服务端资源的浪费.

改为两次握手有可能发生死锁.

TCP简介

• TCP是一个传输层协议 (传输层是什么可以参考TCP/IP协议栈)
• TCP是面向连接的, 必须先建立连接, 再传输数据, 最后释放连接
• TCP提供可靠交付的服务, 数据传输无差错, 不丢失, 无重复, 且按序到达
• TCP提供全双工通信, 通信双方可以同时收发数据
• TCP面向字节流, 其将应用层的数据视为无结构的字节流, 并不知道含义

TCP的标志位和序号

TCP的标志位用来确定TCP的目的, 常见的标志位包括

• SYN: 同步, 用于建立连接和同步序列号
• ACK: 确认, 对已接受的数据包确认
• FIN: 完成, 表示数据已发送完毕, 即将关闭连接
• PSH: 推送, 表示该数据包被接收后应立即交给上层应用, 不在缓存区排队
• RST: 重置, 用于连接复位, 拒绝错误和非法的数据包
• URG: 紧急, 表示数据包应被加急处理

此外还有2个序号:

• seq: 顺序号, 数据包中第一个字节的序号
• ack: 确认号, 响应前面的seq, 值为seq+1, 可以理解为预期下次发送的序列号

KeepAlive机制

• TCP的KeepAlive目的在于保持连接, 检测连接状态
• HTTP协议的Keep-Alive目的是连接复用

3. 发送与接受数据

发送和接受数据使用http协议进行.

HTTP协议简介

• HTTP是基于TCP的应用层通信协议
• HTTP是无状态协议, 其不会对历史请求和通信状态持久化存储, 目的是为了保持简单高效

HTTP的发挥的作用如下图:

HTTP请求

基本结构包括三部分: 请求行, 消息头, 正文

• 请求行包括: 方法, URI, 协议版本
• 消息头包括相关参数, 常见的有 内容格式, 语言, 内容长度等等
• 正文内容由客户端确定

常见请求方法:

• GET: 获取资源 (最常用方法)
• HEAD: 获取资源的元信息, 只传回响应头, 轻量版的GET
• POST: 写入或上传数据, 通常表示新建 (第二常用方法)
• PUT: 类似POST, 含义有细微区别, 通常表示更新, 但用的比较少
• DELETE: 删除资源, 比较危险的操作
• TRACE: 追踪请求响应的传输路径, 多用于链路的测试和诊断
• CONNECT: 和另一个服务器建立特殊的连接隧道, Web服务器作为中间代理
• OPTIONS: 列举可对资源实行的方法

HTTP响应

基本结构包括三部分: 状态行, 消息头, 正文

• 状态行包括: 协议版本, 状态码, 状态码描述
• 消息头包含一些参数, 例如日期, 内容格式, 内容长度
• 正文内容由服务端确定

状态码分类

• 1xx: 指示信息, 表示请求已接收, 继续处理
• 2xx: 成功, 表示请求已被成功接收, 理解, 接受
• 3xx: 重定向, 要完成请求必须进行更进一步的操作
• 4xx: 客户端错误, 请求有语法错误或请求无法实现
• 5xx: 服务器端错误, 服务器未能实现合法的请求

常见状态代码

• 200: OK, 客户端请求成功
• 400: Bad Request, 客户端请求语法错误, 无法被服务器理解
• 404 : Not Found, 请求的资源不存在
• 500: Internal Server Error, 服务器发生内部错误
• 503: Server Unavailable, 服务器当前无法处理客户端请求, 一段时间后可能恢复正常

HTTP与HTTPS

HTTP协议存在一些缺点

• 通信中使用不加密的明文, 会被窃听
• 通信中不验证通信方的身份, 可能存在攻击者伪装
• 无法验证数据的完整性和是否被篡改

为了解决上述缺点, 就有了HTTPS, 其可以简单理解为

HTTPS=HTTP+加密+认证+完整性保护

在协议栈上HTTPS多了SSL (Secure Socket Layer) 或TLS (Transport Layer Security)

4. 与目标主机断开TCP连接 (四次挥手)

用日常生活场景来比喻四次挥手

1. 客户端->服务器: "我不聊了"
2. 服务器->客户端: "我也不聊了"
3. 服务器->客户端: "拜拜"
4. 客户端->服务器: "拜拜"

具体的交互细节

使用Wireshark抓包

1. 客户端->服务器: [FIN]
2. 服务器->客户端: [ACK]
3. 服务器->客户端: [FIN]
4. 客户端->服务器: [ACK]

为什么建立连接是三次握手, 而关闭时需要四次挥手?

建立连接时: 服务端接收到客户端的SYN后, 直接发送 SYN+ACK 同时完成应答(ACK)和同步(SYN), 因此只需要三次.

TCP是全双工的通信协议, 客户端发送FIN表示自己的数据发送完毕, 但此时服务端依然可以发送数据到客户端, 需要等待服务端发送完毕数据后再发送FIN表示服务端也完毕.

参考

【总结】访问一个网页的全过程_网页访问全过程_toumingren527的博客-CSDN博客

访问一个网页的全过程(超详细版)_web访问的过程_小包同学666的博客-CSDN博客

一个域名可以对应多个IP吗？如何通过DNS实现？ - 知乎 (zhihu.com)

DNS域名详细解析过程(最全面，看这一篇就够)_dns解析_bangshao1989的博客-CSDN博客

浏览器输入网址，到显示网页全过程 - 知乎 (zhihu.com)

访问一个网页的全过程(超详细版)_web访问的过程_小包同学666的博客-CSDN博客

使用 WireShark 分析 TCP/IP 三次握手 和 四次挥手 - bylijian - 博客园 (cnblogs.com)

http、https、tcp三次握手，四次挥手学习笔记 - 知乎 (zhihu.com)

聊聊 TCP 中的 KeepAlive 机制 - 知乎 (zhihu.com)

一次完整的HTTP请求过程是怎么样的呢？【图文详解】 - 知乎 (zhihu.com)

一文彻底搞懂 TCP三次握手、四次挥手过程及原理 - 知乎 (zhihu.com)

http://www.tcpipguide.com/free/t_TCPConnectionTermination-2.htm

TCP/IP协议栈详解_mayifan_blog的博客-CSDN博客

深入理解HTTP协议 - 知乎 (zhihu.com)

https://www.geeksforgeeks.org/state-the-core-components-of-an-http-response/

https://zhuanlan.zhihu.com/p/359141330

后文

有些地方写的有问题或者不够明确, 欢迎看到这里的朋友们纠正和补充

内容比较多, 后续还会继续更新完善