客户端输入网址后发生的全过程解析(协议交互、缓存、渲染)

news2024/11/19 19:20:14

目录

      • 1. 输入 URL 并按下回车键
      • 2. DNS 解析
      • 3. TCP 连接
      • 4. 发送 HTTP 请求
      • 5. 服务器处理请求
      • 6. 发送 HTTP 响应
      • 7. 浏览器接收响应
      • 8. 渲染网页
      • 9. 执行脚本
      • 10. 处理其他资源
      • 11. TLS/SSL 加密(如果使用 HTTPS)
        • 握手过程
      • 12. 协议协商和优化
    • 总结


1. 输入 URL 并按下回车键

用户在浏览器中输入 URL(例如 http://www.example.com)并按下回车键。


2. DNS 解析

  1. 浏览器缓存,浏览器首先检查其 DNS 缓存中是否有该域名的 IP 地址。如果有,则使用该地址。
  2. 操作系统缓存,如果浏览器缓存中没有,则查询操作系统的 DNS 缓存。
  3. 本地 Hosts 文件,如果操作系统缓存中也没有,则检查本地的hosts 文件,看是否有手动配置的 IP 地址。
  4. DNS 服务器查询,如果以上步骤都未能找到 IP 地址,则操作系统将查询配置的 DNS 服务器。通常是由互联网服务提供商(ISP)提供的 DNS 服务器。

DNS 查询过程:

  1. 递归查询:本地 DNS 服务器向根 DNS 服务器发送查询请求,根服务器返回顶级域(如 .com)服务器地址。
  2. 迭代查询:本地 DNS 服务器向顶级域服务器查询,顶级域服务器返回权威 DNS 服务器地址。
  3. 最终查询:本地 DNS 服务器向权威 DNS 服务器查询,权威 DNS 服务器返回域名的 IP 地址。
    在这里插入图片描述

3. TCP 连接

三次握手
得到 IP 地址后,浏览器通过 TCP 三次握手建立与服务器的连接:

  1. SYN:客户端发送一个 SYN(同步序列编号)包给服务器,表示请求建立连接。
  2. SYN-ACK:服务器收到 SYN 包后,返回一个 SYN-ACK(同步-确认)包,表示同意连接。
  3. ACK:客户端收到 SYN-ACK 包后,发送一个 ACK(确认)包,表示连接建立。

4. 发送 HTTP 请求

在这里插入图片描述

  1. 构建请求
    连接建立后,浏览器构建一个 HTTP 请求报文,报文包含请求行(例如 GET / HTTP/1.1)、请求头(例如 Host: www.example.com)和可能的请求体。

  2. 发送请求
    浏览器将 HTTP 请求报文通过已建立的 TCP 连接发送到服务器。


5. 服务器处理请求

  1. 解析请求
    服务器接收到请求后,解析 HTTP 请求报文,确定请求的资源和请求类型。

  2. 处理请求
    服务器处理请求,根据请求的资源路径,查询数据库或文件系统,生成响应内容。

  3. 构建响应
    服务器构建 HTTP 响应报文,报文包含状态行(例如 HTTP/1.1 200 OK)、响应头(例如 Content-Type: text/html)和响应体(例如 HTML 文件)。


6. 发送 HTTP 响应

服务器将 HTTP 响应报文通过 TCP 连接发送回客户端。


7. 浏览器接收响应

  1. 检查缓存,浏览器接收到响应后,检查响应头中的缓存控制字段(例如 Cache-ControlExpires),决定是否缓存该响应。
  2. 解析内容,浏览器解析响应体中的 HTML 内容,开始渲染网页。

8. 渲染网页

  1. 构建 DOM 树,浏览器解析 HTML,构建 DOM 树(文档对象模型)。
  2. 构建 CSSOM 树,浏览器解析 CSS 文件,构建 CSSOM 树(CSS 对象模型)。
  3. 构建渲染树,浏览器将 DOM 树和 CSSOM 树结合,构建渲染树。
  4. 布局和绘制,浏览器根据渲染树计算每个元素的位置和尺寸(布局),然后将元素绘制到屏幕上(绘制)。

9. 执行脚本

浏览器解析并执行 JavaScript 脚本,可能会修改 DOM 树,从而触发重新布局和重新绘制。


10. 处理其他资源

  1. 下载资源
    在解析 HTML 过程中,浏览器会发现需要加载的外部资源(例如图片、CSS、JavaScript 文件)。浏览器会发起额外的 HTTP 请求来下载这些资源。

  2. HTTP/2 多路复用
    如果服务器支持 HTTP/2,浏览器可以通过单一 TCP 连接同时请求多个资源,提高资源加载速度。

  3. 缓存
    浏览器会检查这些资源是否已经在缓存中,如果在缓存中且未过期,则直接从缓存中加载资源。


11. TLS/SSL 加密(如果使用 HTTPS)

如果访问的网页是 HTTPS,整个过程会使用 TLS/SSL 加密,确保数据在传输过程中不被窃听或篡改。

握手过程

HTTPS 在 TCP 三次握手后,还需要进行 TLS/SSL 握手:

  1. 客户端 Hello:客户端发送支持的协议版本、加密算法、压缩方法等信息。
  2. 服务器 Hello:服务器选择加密算法和协议版本,并返回服务器证书。
  3. 密钥交换:客户端生成一个随机数,并使用服务器的公钥加密后发送给服务器。双方通过此随机数生成对称密钥。
  4. 握手结束:双方交换 Finished 消息,握手过程结束,之后的数据传输都使用对称加密。
    在这里插入图片描述

12. 协议协商和优化

  1. 协商协议版本和加密算法
    在 TLS/SSL 握手过程中,客户端和服务器会协商使用的协议版本和加密算法。

  2. 缓存控制
    服务器可以通过 HTTP 响应头控制缓存策略,如 Cache-ControlETagLast-Modified 等,浏览器根据这些头信息决定是否缓存资源及其有效期。

  3. 压缩
    服务器可以通过 Content-Encoding 响应头指示对响应内容进行压缩(如 Gzip),以减少传输数据量。


总结

当用户在浏览器中输入URL并按下回车,浏览器首先查询DNS解析域名获取IP地址,然后通过TCP三次握手建立与服务器的连接,并发送HTTP请求。服务器处理请求并返回HTTP响应,浏览器接收响应后检查缓存,解析HTML构建DOM树、CSSOM树和渲染树,进行布局和绘制,同时解析和执行JavaScript脚本,加载并渲染其他外部资源。如果使用HTTPS,还包括TLS/SSL握手过程。整个过程中涉及协议协商、缓存控制和数据压缩,最终呈现给用户完整的网页。

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

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

相关文章

有关排序的算法

目录 选择法排序 冒泡法排序 qsort排序(快速排序) qsort排序整型 qsort排序结构体类型 排序是我们日常生活中比较常见的问题,这里我们来说叨几个排序的算法。 比如有一个一维数组 arr[8] {2,5,3,1,7,6,4,8},我们想要把它排成升序&#…

苹果将推出全新AI培训课程;生成式AI手机市场将迎来爆发式增长

🦉 AI新闻 🚀 苹果将推出全新AI培训课程 摘要:IT之家消息,苹果宣布,今年秋季将在6个国家的18所开发者学院推出AI培训课程,目标群体为学生、导师和校友。课程涵盖机器学习模型的构建及部署,Cor…

姜萍的启示:分数不是唯一,天赋引领专业选择超越名校

你好,我是三桥君。 24年高考帷幕落下,一场新的思考与选择悄然来临。 对于每一位高考考生,学校和专业都是开启大学新生活的两个前置必选项。 在这关键时刻,全网媒体却被一则关于“一名17岁中专女学生姜萍在全球数学竞赛获得第12名”…

数字孪生涉及到的9大技术栈,都是难啃骨头呀。

数字孪生涉及到多个技术栈,包括但不限于以下几个方面: 数据采集和传感器技术: 数字孪生需要实时获取物理世界的数据,因此需要使用各种传感器技术(如温度传感器、压力传感器、运动传感器等)来采集数据&…

排序(3)【归并排序】【计数排序】【排序算法度及其稳定性分析】

一.归并排序 归并排序(MERGE-SORT)是建立在归并操作上的一种有效的排序算法,该算法是采用分治法(Divide and Conquer)的一个非常典型的应用。将已有序的子序列合并,得到完全有序的序列;即先使每个子序列有…

C++ 66 之 类模版

#include <iostream> #include <string> using namespace std;// 习惯性 < >中 类模板用class 普通的函数模板就用typename // template<class NAMETYPE, class AGETYPE> template<class NAMETYPE, class AGETYPE int> // 可以设置默认的类型值…

集团门户网站的设计

管理员账户功能包括&#xff1a;系统首页&#xff0c;个人中心&#xff0c;管理员管理&#xff0c;论坛管理&#xff0c;集团文化管理&#xff0c;基础数据管理&#xff0c;公告通知管理 前台账户功能包括&#xff1a;系统首页&#xff0c;个人中心&#xff0c;论坛&#xff0…

收银系统源码-千呼新零售2.0【线下促销】

千呼新零售2.0系统是零售行业连锁店一体化收银系统&#xff0c;包括线下收银线上商城连锁店管理ERP管理商品管理供应商管理会员营销等功能为一体&#xff0c;线上线下数据全部打通。 适用于商超、便利店、水果、生鲜、母婴、服装、零食、百货等连锁店使用。 详细介绍请查看下…

在LangChain中,LLM(大型语言模型)和LLM Chain的区别是什么?

简单来说&#xff0c;LLM是一个大型语言模型&#xff0c;而LLM Chain是由多个LLM或其他组件组成的链式结构&#xff0c;用于在LangChain中构建复杂的自然语言处理流程。 Direct LLM Interface: 直接大型语言模型&#xff08;LLM&#xff09;接口&#xff1a; llm Open…

【NOI-题解】1234. 任意输入一正整数N,要求把它拆成质因子的乘积。1446. 人口增长问题

文章目录 一、前言二、问题问题&#xff1a;1234. 任意输入一正整数N&#xff0c;要求把它拆成质因子的乘积。问题&#xff1a;1446. 人口增长问题 三、感谢 一、前言 本章节主要对循环应用的题目进行讲解&#xff0c;包括《1234. 任意输入一正整数N&#xff0c;要求把它拆成质…

防止员工离职导致数据泄露,员工离职后把文件带出公司

中科数安的电脑文件资料透明加密防泄密系统确实能够在一定程度上防止员工离职导致的数据泄露。以下是具体的分析&#xff1a; www.weaem.com 访问控制与权限管理&#xff1a;系统实施了严格的权限管理制度&#xff0c;对核心文件和数据资源进行细致的访问权限划分。这意味着&am…

【数据结构与算法】稀疏矩阵(三元组,十字链表存储)详解

给出稀疏矩阵的节省内存的存贮结构并写出相应的输入、输出算法。 稀疏矩阵是一个大部分元素为0的矩阵。为了节省内存&#xff0c;我们可以只存储非零元素。一种常见的存储结构是三元组&#xff0c;每个三元组包含一个非零元素的行索引、列索引和值。 #include <stdio.h>…

BC-Linux 8.6最小化安装的服务器启用GNOME图形化界面

本文记录了BC-Linux 8.6最小化安装的服务器如何启用GNOME图形化界面的过程。 一、服务器环境 1、系统版本 [rootlocalhost ~]# cat /etc/os-release NAME"BigCloud Enterprise Linux" VERSION"8.6 (Core)" ID"bclinux" ID_LIKE"rhel fe…

基于STM32和人工智能的智能小车系统

目录 引言环境准备智能小车系统基础代码实现&#xff1a;实现智能小车系统 4.1 数据采集模块4.2 数据处理与分析4.3 控制系统4.4 用户界面与数据可视化应用场景&#xff1a;智能小车管理与优化问题解决方案与优化收尾与总结 1. 引言 随着机器人技术的发展&#xff0c;智能小…

Android断点续传原理及实现

常见两种网络请求方式 一、 HttpURLConnection HttpURLConnection的setRequestProperty()方法&#xff0c;对我们要读取的字节部分进行控制&#xff0c;比如: 1.Range0-100代表只读取前100个字节。 2.Range100-500代表读取从第100个字节开始&#xff0c;读到第500个字节为止。…

教你如何安装 IntelliJ IDEA

安装 IntelliJ IDEA 的步骤通常如下&#xff0c;这里提供的是基于 Windows 系统的安装指南。 下载 IntelliJ IDEA 1. 访问 JetBrains 官方网站&#xff1a;[https://www.jetbrains.com/idea/download/](Download IntelliJ IDEA – The Leading Java and Kotlin IDE) 2. 选择适…

让AI代替我写代码???——Codeium安装及使用

序 不知不觉又到了期末大作业的时间了&#xff0c;面对老师布置的超繁琐代码项目&#xff0c;竟一时有些发怵&#xff0c;不知道从何下手才好…… 但是&#xff0c;懒惰如张同学的我怎么能拘泥于老老实实完成这些毫无技术可言的作业呢&#xff1f; 于是乎&#xff0c;我便寻…

【YOLOv9改进[注意力]】在YOLOv9中使用注意力CascadedGroupAttention(2023)的实践 + 含全部代码和详细修改方式

本文将进行在YOLOv9中使用注意力CascadedGroupAttention的实践,助力YOLOv9目标检测效果的实践,文中含全部代码、详细修改方式。助您轻松理解改进的方法。 改进前和改进后的参数对比: 目录 一 CascadedGroupAttention 二 在YOLOv9中使用注意力CascadedGroupAttention的实…

【操作系统】操作系统实验04-文件系统扩展

题目要求&#xff1a; 对【程序5_9】进行扩展&#xff0c;要求参数为目录名&#xff0c;且其下至少有三层目录&#xff0c;分别用深度遍历及广度遍历两种方法对此目录进行遍历&#xff0c;输出此目录下所有文件的大小及修改时间。 1. 程序代码&#xff08;注意程序格式&#…

SYD88xx使代码在RAM内存中执行/运行

SYD88xx使代码在RAM中执行 SYD8811/8810默认都是cache模式的&#xff0c;但是在代码首次运行的时候&#xff0c;需要将代码从flash搬到cache中执行&#xff0c;这样第一次的代码执行可能会比较慢&#xff0c;这里提供一个将需要提速的代码放到RAM中执行的方法。 对于SYD8811…