输入一个url全过程详解
1. 用户在浏览器中输入url,浏览器接收到url。
2.浏览器接收到这个url之后,会根据这个url会先查看缓存,如果有缓存且没有过期的话直接提供给客户端,完成页面渲染。
3.否则浏览器就会通过DNS解析url ,获得协议名、主机名、端口号。
DNS解析详解:
输入域名时,操作系统会先检查自己本地host文件中是否有这个网址的映射关系,如果有,就调用这个IP地址映射,完成域名解析。
如果host没有这个域名的映射,则查找本地的DNS解析器缓存,是否有这个网址映射关系,如果有,直接返回,完成域名解析。
如果本地解析器缓存没有的话,则查找本地DNS服务器,如果要查询的域名包含在本地配置资源中,则完成域名解析。
如果本地DNS服务器没有的话,就会请求根服务器,根服务器就会返回一个负责该区域的主服务器IP
本地域名服务器根据主服务器IP,链接到这个主域名服务器,如果有这个域名的话,就调用这个IP地址映射,完成域名解析。如果没有的话,则递归请求下一级域名服务器,直到找到对应的域名
4.然后浏览器就会根据这个IP跟对应的服务端建立tcp连接
TCP三次握手:
第一次握手:客户端向服务器发送一个 SYN=1 报文,并指定客户端的初始化序列号 seq=x。此时客户端处于SYN_Sent 状态
第二次握手:服务器接收到客户端的 SYN=1 报文后,同意连接的话,会发出一段确定报文。确定报文中应该ACK= 1,SYN= 1,确认号是ack=x+1,同时也要为自己初始化一个序列号seq=y.此时服务器处于 SYN-RCVD
第三次握手:客户端接收到 SYN 报文之后,还会向服务器发送确定。确定报文的 ACK=1,ack=y+1 ,自己的序列号变成 x+1。TCP 连接建立,客户端处于 已连接状态 。
5.当服务器接受到客户端的确认后也进入了 已连接状态 。此时双方就可以开始通信了
6.接下来就是浏览器向服务器发送HTTP请求
TCP 连接建立之后,浏览器端会构建请求行、 请求头等信息,并把和该域名相关的 Cookie 等数据附加到请求头中,然后向服务器发送构建的请求信息。如果是 HTTPS,还需要进行 TSL 协商。服务器还会检查 HTTP 的请求头,看是否包含缓存信息。
7.服务器接受并解析这个请求然后发送一个数据包给浏览器
8.关闭浏览器与服务器之间的连接
TCP四次挥手:
- 第一次挥手:客户端向服务端发送一个FIN报文,报文中指定一个序列号。此时,客户端处于 FIN_WAIT-1状态
- 第二次挥手:服务端收到客户端 发送的 FIN报文后,会将客户端的序列号+1 作为ACK报文的序列号值发送给客户端,表明收到了客户端的报文。然后服务器就会处于 CLOSE-WAIT-1状态
- 第三次挥手:服务端向客户端发送 FIN报文,且指定一个序列号。此时,服务端处于 LAST_ACK状态
- 第四次挥手:客户端收到服务端发送的FIN报文后,会将服务端的序列号+1 作为ACK报文的序列号值发送给服务端,此时客户端处于 TIME_WAIT 状态。需要等服务端确定收到自己的ACK报文后才会进入 CLOSED 状态
- 服务端接收到 ACK报文后,就关闭连接,处于 CLOSED 状态。
9.浏览器就会根据这个数据包解析HTML文档,构建DOM树,构建CSSOM树,解析js脚本,下载资源
渲染的具体过程:
浏览器会通过 HTML Parser (HTML解析器)根据深度遍历的原则,将html解析成 DOM tree (DOM 树)。
浏览器会通过 CSS Parser (CSS解析器)将CSS 解析成 CSS Rule Tree(CSSOM 树)。
浏览器会将 javascript 通过 DOM API 或者 CSSOM API 将 JS代码进行解析并应用到布局中,且会呈现出响应式的结果。
根据 DOM 树 与 CSSOM 树构建出响应的 render Tree。
接下来就是进行重排(reflow)与重绘(repaint)。当页面中任意一个节点的几何尺寸发生变化的时候,就会触发重排,就会重新计算页面中所有的节点的位置。当页面中任意元素的样式属性发生变化时(几何尺寸不发生变化),就会发生重绘,重新绘画发生变化的元素。重排一定会触发重绘,而重绘不一定会有重排。
paint:绘制。遍历render Tree,并调用硬件图形API 来绘制每个节点到页面上。
10.最终就会显示出这个页面
输入一个url全过程详解的更多相关文章
- 浏览器解析html全过程详解
前端文摘:深入解析浏览器的幕后工作原理 关于浏览器解析html全过程详解 输入URL到浏览器接收返回的数据的整个过程 TCP报文格式详解 IP报文格式详解 Linux IO模式及 select.pol ...
- StreamingContext详解,输入DStream和Reveiver详解
StreamingContext详解,输入DStream和Reveiver详解 一.StreamingContext详解 1.1两种创建StreamingContext的方式 1.2SteamingC ...
- 网易笔试题:浏览器中输入一个url后回车到返回页面信息的过程
You enter a URL into the browser输入一个url地址 The browser looks up the IP address for the domain name浏览器 ...
- URL组成部分详解
URL组成部分详解 URL是Uniform Resource Locator的简写,统一资源定位符. 一个URL是由以下几部分组成的: scheme://host:port/path/?query-s ...
- 转载]OK6410之tftp下载内核,nfs挂载文件系统全过程详解[转]
原文地址:OK6410之tftp下载内核,nfs挂载文件系统全过程详解[转]作者:千山我独行 由于工作的平台也是嵌入式,差不多的平台,所以一直就没有把自己买过来的ok6410板子好好玩玩.以前一直都是 ...
- 第五篇Django URL name 详解
Django URL name 详解 利用Django开发网站,可以设计出非常优美的url规则,如果url的匹配规则(包含正则表达式)组织得比较好,view的结构就会比较清晰,比较容易维护. Djan ...
- Flask(4)- URL 组成部分详解
URL Uniform Resource Locator 的简写,中文名叫统一资源定位符 用于表示服务端的各种资源,例如网页 下面将讲解 Flask 中如何提取组成 URL 的各个部分 URL 组 ...
- 用一个开发案例详解Oracle临时表
用一个开发案例详解Oracle临时表 2016-11-14 bisal ITPUB  一.开发需求 最近有一个开发需求,大致需要先使用主表,或主表和几张子表关联查询出ID(主键)及一些主表字段 ...
- 编写一个C语言函数,要求输入一个url,输出该url是首页、目录页或者其他url
编写一个C语言函数,要求输入一个url,输出该url是首页.目录页或者其他url 首页.目录页或者其他url 如下形式叫做首页: militia.info/ www.apcnc.com.cn/ htt ...
随机推荐
- js 如何判断变量类型
自定义一些类型 const boolean = true const string = '这是一个字符串' const number = 1 const array = [] const object ...
- opencv如何在jupyter notebook中显示图片
方法一: from matplotlib import pyplot as plt import numpy as np import cv2 img = cv2.imread('img.jpg') ...
- GitHub 毕业年鉴「GitHub 热点速览 v.22.20」
GitHub 毕业需要什么呢?一个 PR!那么提交一个 PR 需要什么?也许你是使用终端命令来提交 git 操作的,那么你可以了解下 Bash-Oneliner,收录了大量好用的 bash 命令,虽然 ...
- 层层剖析一次 HTTP POST 请求事故
vivo 互联网服务器团队- Wei Ling 本文主要讲述的是如何根据公司网络架构和业务特点,锁定正常请求被误判为跨域的原因并解决. 一.问题描述 某一个业务后台在表单提交的时候,报跨域错误,具体如 ...
- hive从入门到放弃(六)——常用文件存储格式
hive 存储格式有很多,但常用的一般是 TextFile.ORC.Parquet 格式,在我们单位最多的也是这三种 hive 默认的文件存储格式是 TextFile. 除 TextFile 外的其他 ...
- Java添加条形码到PDF表格
条码的应用已深入生活和工作的方方面面.在处理条码时,常需要和各种文档格式相结合.当需要在文档中插入.编辑或者删除条码时,可借助于一些专业的类库工具来实现.本文,以操作PDF文件为例,介绍如何在编辑表格 ...
- 且看这个Node全栈框架,实现了个Cli终端引擎,可无限扩充命令集
背景介绍 一般而言,大多数框架都会提供Cli终端工具,用于通过命令行执行一些工具类脚本 CabloyJS提供的Cli终端工具却与众不同.更确切的说,CabloyJS提供的是Cli终端引擎,由一套Cli ...
- 【C++ 字符串题目】 输入三个人名,按字母顺序排序输出
题目来源:https://acm.ujn.edu.cn Problem A: [C++ 字符串] 输入三个人名,按字母顺序排序输出 Time Limit: 1 Sec Memory Limit: 1 ...
- 清除 GitHub 历史记录的隐私信息
清理 github 敏感信息 有的时候我们在提交到github上的内容不小心含有敏感代码,比如密码,公司的服务器IP等.这个时候就要通过一些手段清除这些信息. GitHub官方方案比较码放,所以推荐使 ...
- 超级重磅!Apache Hudi多模索引对查询优化高达30倍
与许多其他事务数据系统一样,索引一直是 Apache Hudi 不可或缺的一部分,并且与普通表格式抽象不同. 在这篇博客中,我们讨论了我们如何重新构想索引并在 Apache Hudi 0.11.0 版 ...