URL到页面: 探索网页加载的神秘过程

news/2024/11/28 21:54:21/

当我们从浏览器的地址栏输入 URL, 按下回车,

img

再到最后出现需要的网页界面,

img

这中间究竟发生了什么, 接下来就一步步进行解析.

主要是如下过程:

  1. 输入网址
  2. DNS 解析
  3. 客户端发送 HTPP 请求
  4. 建立 TCP 连接
  5. 服务器处理请求, 计算响应, 返回响应
  6. 浏览器渲染页面
  7. 关闭连接

本篇中只是概述整个过程, 主要是说明从输入 URL 到展示出页面这个过程中做了什么, 但不会对这中间的每个子过程进行详细的介绍, 这些内容在我前面的博客都有总结过, 不清楚的话可以参考看一看, 具体如下.

计网之初识网络(理解网络传输的基本流程)

计网传输层协议:UDP和TCP

计网之IP协议和以太网, DNS

计网之HTTP协议

1. 输入网址

当在浏览器中输入 URL 后敲下回车, 浏览器会对输入的信息进行以下判断:

  1. 检查输入的内容是不是一个合法的 URL 链接还是一个待搜素的关键词.
  2. 如果是合法的URL链接, 判断输入的URL是不是一个完整的URL, 如果不是, 浏览器就会自己猜测, 然后补全这个URL.
  3. 如果是一个待搜索的关键词, 浏览器就会结合用户设置的默认搜索引擎的 URL 来进行搜索.

2. 进行DNS域名解析

DNS 是由解析器和域名服务器组成的, 作用是将域名转化成 IP 地址.

我们平时在浏览器中输入的网址, 其实就是域名, 当我们输入网址按下回车时, 就发起了一个 GET 请求, 此时浏览器的 DNS 系统首先要做的事情就是解析这个域名, 将域名转化成 IP 地址.

通俗的讲, 我们更习惯于记住一个网站的名字, 比如 www.baidu.com, 而不是记住它的 IP 地址, 比如: 167.23.10.2; 而计算机更擅长记住网站的 IP 地址, 而不是像 www.baidu.com 等链接; 类比一下, 其实 DNS 就相当于一个电话本, 你要找 www.baidu.com 这个域名, 那就去翻一翻电话本, 就能知道它的电话 (IP) 是 167.23.10.2.

3. 进行封装

浏览器拿到域名对应的 IP 地址之后, 就可以构造出 HTTP 数据报, 将其交给传输层, 会以一个随机端口 (1024~65535) 向服务器的 Web 程序的 80 端口 (是服务器侦听网页客户端请求的默认端口) 发起 TCP 的连接请求 (三次握手) , 接着将数据交给了网络层, IP协议将其封装成立IP数据报, 然后交给数据链路层, 转换成二进制形式的比特 (bit) 流, 从网卡发送出去, 再把比特转换成电子, 光学或微波信号在网络中传输最终通过网卡传输出去.

4. 进行传输

传输的过程中, 经过一些网络设备, 交换机和路由器等;

  • 交换机把数据分用到数据链路, 再重新封装, 继续转发.
  • 路由器会把数据分用到网络层, 重新封装, 接着路由器会根据数据报中的目的 IP 在路由表中匹配, 找个合适的方向发出去, 每次转发 TTL 都会减1 (TTL 是一个 IP 协议的值, 它告诉网络, 数据包在网络中的时间是否太长而应被丢弃).

5. 服务器接收请求, 根据请求计算响应, 重新封装, 返回响应

服务器通过监听端口来获取到客户端的 HTTP 请求, 与客户端建立 TCP 连接后, 服务器开始接收客户端发来的数据, 首先进入到网卡, 然后是进入到内核的 TCP/IP 协议栈分用数据 (用于识别该连接请求, 解封包, 一层一层的剥开), 终通过 HTTP 解码, 从接收到的数据中进行解析, 找到你想要访问的那个资源, 将资源构造成 HTTP 响应, 再将响应层层封装发送给客户端浏览器.

这样一个 HTTP 通信就完成了, 服务器会根据 HTTP 请求中的 Connection 字段, 决定是否关闭 TCP 连接通道, Connection 字段值为 keep-alive 时, 服务器不会立刻关闭连接, 保证通信的完成.

6. 浏览器接收响应, 进行渲染页面, 最终呈现一个完整的页面

浏览器接收到响应内容之后, 还是先对数据进行分用, 最后浏览器会解析 HTML 文件生成主页框架(构建 dom 树), JS 的解析是由浏览器中的 JS 解析引擎完成的, 比如谷歌的是 V8.

在解析过程中, 如果同时遇到请求外部资源时, 如图片, 外链的 CSS 等静态资源的引用, 会向服务器继续发送请求, 请求的内容就是主页里的一些资源, 例如图片, 视频, JS文件等…

这些请求过程是异步的, 并不会影响 HTML 页面进行加载.

7. 断开连接

此时整个过程结束, 最后通过四次挥手, 浏览器和客户端的连接.


http://www.ppmy.cn/news/261260.html

相关文章

H3C交换机常用命令大全

一.用户配置: system-view [H3C]super password H3C 设置用户分级密码 [H3C]undo super password 删除用户分级密码 [H3C]localuser bigheap 123456 1 Web网管用户设置,1(缺省)为管理级用户,缺省admin,admin [H3C]undo localuser bigheap 删除Web网管用…

time.h 详细介绍

time.h 详细介绍 < ctime> (time.h)包含获得和使用日期和时间信息的函数的定义。一、Macro constants&#xff08;宏常量&#xff09; CLOCKS_PER_SEC&#xff1a;滴答声/秒&#xff0c;时间的单位NULL&#xff1a;空指针 二、types&#xff08;类型&#xff09; clo…

HI3516A/Hi3516D H265流结构分析

HI3516A/Hi3516D H265 ES流结构分析 通过录制H265的ES流&#xff0c;保存为文件&#xff0c;经过VLC(版本为V2.2.1),播放可以正常显示。在文件中查找00 00 00 01NALU头&#xff0c;发现在有6种开头分别为&#xff1a; 1&#xff09;00 00 00 01 40 01 2&#xff09;00 00 00 01…

机器人学回炉重造(1):正运动学、标准D-H法与改进D-H法的区别与应用(附ABB机械臂运动学建模matlab代码)

写在前面 学习代码都记录在个人github上&#xff0c;欢迎关注~ 书读百遍&#xff0c;其义自见。 要想当一名合格的机器人工程师&#xff0c;机器人学就是base_link&#xff0c;看多少遍都不为过。现在回炉重造一下&#xff0c;记录一下学习笔记&#xff08;以照片形式&#…

计算机中h是几进制,16进制后面用H表示,其他进制的用什么表示

16进制后面用H表示,其他进制的用什么表示以下文字资料是由(历史新知网www.lishixinzhi.com)小编为大家搜集整理后发布的内容,让我们赶快一起来看一下吧! 16进制后面用H表示,其他进制的用什么表示, 为什么100H是表示16进制的二进制数,其他的怎么表示 H表示16进制呀后缀H表示…

实验5、D/A转换实验

实验内容 基础部分&#xff1a; 1、编写程序&#xff0c;产生周期的锯齿波、矩形波、三角波和阶梯波&#xff0c;经D/A转换&#xff0c;显示在软件模拟示波器上。(要求&#xff1a;每种波形的周期数、阶梯波的阶梯数可通过参数设置。) 拓展部分&#xff1a; 2在软件模拟示波器上…

机械臂D-H坐标系的建立

正解与逆解的求解需要相应的机器人运动方程&#xff0c;其中关键的就是DH参数表 DH参数表用来描述机器人各关节坐标系之间的关系&#xff0c;有了DH参数表就可以在机器人各关节之间进行坐标转换 求解正解就是从关节1到关节5的坐标转换 基本知识 &#xff1a; 关节&#xff1a…

H无穷控制学习笔记——H无穷/H2控制

一、 H ∞ / H 2 H_{\infty}/H_2 H∞​/H2​控制问题 实际设计过程中&#xff0c;人们常常需要系统满足多项性能要求。 对于这样的系统&#xff1a; x ˙ A x B u B 1 w 1 B 2 w 2 z 1 C 1 x D 10 u D 11 w 1 z 2 C 2 x D 20 u D 22 w 2 \dot xAxBuB_1w_1B_2w_2\\ …