【面试那些事儿】浏览器键入网址到网页显示,期间发生了什么

当用户在浏览器中键入网址并按下回车键后,直到最终显示出完整的网页内容,这一过程中经历了哪些步骤呢?

这是一道经典的面试题,我们来看看具体有哪些阶段。

1. 解析URL

  • 浏览器首先解析用户输入的URL,判断它的语法和协议类型(通常是HTTP或HTTPS)。
  • 如果URL无效或不符合规范,浏览器可能尝试将其作为搜索查询提交给默认的搜索引擎。

标准的URL组成: 

image.png

[图片来源网络]

2. DNS域名解析

  • 浏览器需要将URL中的域名(如www.server.com)转化为IP地址。
  • 首先检查本地DNS缓存,如果有缓存记录,则直接使用IP地址。
  • 若缓存中没有记录,则浏览器发起DNS查询,依次通过本地DNS服务器、根域名服务器、顶级域名服务器和权威域名服务器来解析域名,最终获取到目标服务器的IP地址
2.1 什么是DNS

比如我们打电话的时候,必须要知道对方的电话号码,但由于电话号码难以记忆,所以通常我们会将对方电话号 + 姓名保存在通讯录里。

所以,有一种服务器就专门保存了 Web 服务器域名与 IP 的对应关系,它就是 DNS 服务器。

DNS中的域名是有层级关系的,如wwww.server.com, 实际上域名后面还有一个点,如www.server.com., 最后一个点代表根域名,域名的层级关系类似一个树状结构:

  • 根DNS服务器(.)
  • 定级域DNS服务器(.com)
  • 权威DNS服务器(server.com)

image.png

[图片来源网络]

2.2 DNS解析域名过程示例

image.png

[图片来源网络]

3. 建立TCP连接

  • 在获取到IP地址后,浏览器利用TCP协议与服务器建立连接,通常涉及到TCP的“三次握手”过程,以确保连接的可靠性。
  • 对于HTTPS(安全超文本传输协议),此阶段还包括TLS/SSL握手过程以加密通信通道。

4. 发送HTTP请求

  • 成功建立连接后,浏览器构造一个HTTP请求报文(如GET或POST请求),包含请求方法、URL、协议版本、头部字段(如User-Agent、Accept-Language等)以及可能有的请求体数据。
  • 浏览器将构建好的HTTP请求发送给服务器指定的端口(通常是80端口对于HTTP,或者443端口对于HTTPS)。

5. 服务器处理请求

  • 服务器接收到请求后,由Web服务器软件(如Apache、Nginx等)解析请求并交由后台的应用程序(如PHP、Java、Node.js等)处理。
  • 应用程序根据请求内容从数据库或文件系统中检索所需资源,并生成响应内容。

6. 服务器返回HTTP响应

  • Web服务器将生成的HTML文档、CSS样式表、JavaScript脚本、图片和其他资源封装成HTTP响应报文,其中包括状态码(如200 OK)、响应头部和响应正文。

7. 浏览器接收响应,并渲染页面

  • 浏览器接收HTTP响应,并开始解析响应正文(即HTML文档)。
  • 根据HTML文档结构创建DOM树,同时解析CSS样式信息生成CSSOM树,随后将两者合并形成渲染树(Render Tree)。
  • 渲染树构建完成后,浏览器进行布局(Layout)计算各个元素的位置,并绘制(Painting)页面内容。
  • 同时,浏览器还会执行JavaScript脚本,脚本可能会影响DOM结构、CSSOM树及页面渲染。

8. 异步资源加载

  • 页面渲染的同时,浏览器继续加载页面中引用的其他资源,如图片、字体、外部脚本和样式表等。
  • 当这些资源加载完毕后,浏览器更新页面以反映新资源的影响。

9. 交互与时间处理

  • 用户可以与页面进行交互,浏览器监听并处理用户的点击、滚动等事件,触发相应的JavaScript代码执行。

完成以上所有步骤后,网页内容才会完整地呈现在用户面前。这个过程涉及到了网络通信、操作系统、浏览器引擎等多个层面的技术协同工作。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://xiahunao.cn/news/2906566.html

如若内容造成侵权/违法违规/事实不符,请联系瞎胡闹网进行投诉反馈,一经查实,立即删除!

相关文章

大话设计模式之策略模式

策略模式是一种行为设计模式,它允许在运行时选择算法的行为。这种模式定义了一族算法,将每个算法都封装起来,并且使它们之间可以互相替换。 在策略模式中,一个类的行为或其算法可以在运行时改变。这种模式包含以下角色&#xff1…

flume配置文件后不能跟注释!!

先总结:Flume配置文件后面,不能跟注释,可以单起一行写注释 报错代码: [ERROR - org.apache.flume.SinkRunner$PollingRunner.run(SinkRunner.java:158)] Unable to deliver event. Exception follows. org.apache.flume.EventDel…

2024跨境电商新型选品方法

是不是有很多卖家一到旺季就为选品发愁?担心选错产品或是错过机会?今天就给大家打开思路,分享2024更好用的选品方法,解决大家的选品难题! 2024跨境电商新型选品方法 1️⃣ 本土卖家观察法 利用社交媒体平台如Instagram…

Linux系统中安装一些常用的插件备用

Linux系统中安装一些常用的插件备用 1.安装wget yum -y install wget 2.安装vim yum -y install vim-enhanced 3.更换yum源为国内的阿里云源(选择) 1、备份CentOS-Base.repo mv /etc/yum.repos.d/CentOS-Base.repo /etc/yum.repos.d/CentOS-Base.…

3d智慧火电厂可视化管理平台提升企业的经济效益

在数字化时代的浪潮中,我们迎来了一个崭新的概念——“智慧火力火电厂”。这一创新理念将前沿信息技术与传统的火力发电工艺完美融合,引领着电力生产与管理的深刻变革。 火电厂3D可视化展示系统融合了数字孪生、3D可视化、物联网、人工智能和大数据等尖端…

PN8034芯朋微PN8034SSC-R1B非隔离SOP7封装12V300MA电源芯片

PN8034集成PFM控制器及650V高雪州能力智能功本MOSFET,用于外图元器件极精简的小功本非隔离开关电源。PN8034内置高压启动模块,实现系统快速启动,超低待机功能。该芯片提供了完整的智能化保护功能,包括过流保护,欠压保护…

【Python】python2.7升级到python3.x

这里写目录标题 1.检查当前python版本2.下载最新的python3. pip安装4.系统默认python调整5 .错误 1.检查当前python版本 python -v2.下载最新的python python下载地址: wget https://www.python.org/ftp/python/3.12.2/Python-3.12.2.tar.xz进行解压 tar -xvf P…

设计模式——结构型——外观模式Facade

处理器类 public class Cpu {public void start() {System.out.println("处理器启动了...");} } 内存类 public class Memory {public void start() {System.out.println("内存启动了...");} } 硬盘类 public class Disk {public void start() {Syste…

接口自动化测试框架:Junit5+RestAssured+Allure

需求分析 需求点需求分析通过 yaml 配置接口操作和用例后续新增接口和测试用例只需要编写 yaml 文件即可实现。可以支持接口间的参数传递具有参数依赖的接口可以进行变量的抽取和参数赋值。支持全局、用例维度的变量存储比如时间截命名法中要用到的时间截后缀。支持用例软断言…

Mysql从0到1 —— CRUD/索引/事务

文章目录 1 预备知识1.1 安装1.2 登录 & 退出1.3 配置文件my.cnf 2 基础知识2.1 链接服务器2.2 什么是数据库2.3 基本使用2.3.1创建表2.3.2 插入数据 2.4 服务器、数据库、表的关系2.5 SQL分类2.6 存储引擎 3 Mysql数据库的操作3.1 创建和删除3.2 字符集和校验规则3.3 查看…

【Spring源码】WebSocket做推送动作的底层实例

一、前瞻 Ok,开始我们今天的对Spring的【模块阅读】。 那就挑Web里的WebSocket模块,先思考下本次阅读的阅读线索: WebSocket在Spring里起到什么作用这个模块采用了什么设计模式我们都知道WebSocket可以主动推送消息给用户,那做推…

Spring Boot 统一数据返回格式 分析 和 处理

目录 实现统一数据格式 测试 原因分析 解决方案 🎥 个人主页:Dikz12📕格言:吾愚多不敏,而愿加学欢迎大家👍点赞✍评论⭐收藏 实现统一数据格式 统⼀的数据返回格式使⽤ ControllerAdvice 和 Response…

Canal解决Redis缓存与Mysql数据库的一致性问题

1、什么是Canal? 如何解决Redis缓存与Mysql数据库的一致性问题?我们常用数据双删缓存超时设置去解决。这样最差的情况,就是在超时时间内,数据存在不一致。 canal,译为管道,主要用途是基于 MySQL 数据库增…

redis在docker安装并启动流程

1、启动server docker run -d -p 6379:6379 --name redis01 redis:7.2.4以上命令,每次启动新的Redis容器,数据会丢失。 我们需要挂载数据文件,在宿主机上面,这样就可以持久化数据. 2、挂载数据文件(可根据需求选择…

关系型数据库mysql(7)sql高级语句①

目录 一.MySQL常用查询 1.按关键字(字段)进行升降排序 按分数排序 (默认为升序) 按分数升序显示 按分数降序显示 根据条件进行排序(加上where) 根据多个字段进行排序 ​编辑 2.用或(or&…

Vue3:快速上手路由器

本人在B站上关于vue3的尚硅谷的课程,以下是整理一些笔记。 一.路由器和路由的概念 在 Vue 3 中,路由(Router)和路由器(Router)是两个相关但不同的概念。 1. 路由(Router)&#xff…

本地部署的stable diffusion 如何更新controlnet?

stable diffusion 未启动状态 点击“版本管理” 点击“扩展” 找到controlnet,点击右边的“更新”按钮 完成!

VBA技术资料MF135:多值匹配查找

我给VBA的定义:VBA是个人小型自动化处理的有效工具。利用好了,可以大大提高自己的工作效率,而且可以提高数据的准确度。“VBA语言専攻”提供的教程一共九套,分为初级、中级、高级三大部分,教程是对VBA的系统讲解&#…

Windows系统下ESP-IDF环境的搭建

第一步:clone项目,建议是下到"Desktop\esp-idf"的路径 下载地址:https://github.com/espressif/esp-idf 第二步:在VSCode下载ESP-IDF插件 第三步:在Setup页面选择第一个选项EXPRESS 参考文档:h…

#Linux系统编程(共享内存)

(一)发行版:Ubuntu16.04.7 (二)记录: (1)什么是共享内存 共享内存是System V版本的最后一个进程间通信方式。共享内存,顾名思义就是允许两个不相关的进程访问同一个逻辑…