从输入URL到页面加载完成的过程

1.在浏览器输入URL
2.判断是否有永久重定向(301),如果有则直接跳转到对应URL
3.查询浏览器缓存
3.1 是否有强缓存,强缓存是否过期
3.1.1 强缓存通过两个HTTP请求头进行控制'Expires' 和'Cache-control'
--HTTP1.0提供Expires,值为一个绝对时间表示缓存的有效日期
--HTTP1.1提供Cache-control;max-age=,值为以秒为单位的最大有效时间
3.2 强缓存失效,则转为协商缓存
3.2.1 通过发送资源的if-modified-Since到服务器查询资源是否修改过,未修改则返回304状态码让浏览器取本
地缓存,修改过则返回200状态码及最新资源并更新if-modified-Since的值
3.2.2 特殊的Etag(唯一性的串或者hash值),表示资源内容是否修改过。发送if-none-match查询文件内容(而不是时间)是否改动来决定是否使用缓存
4.浏览器解析URL获取协议、主机、端口、path
5.浏览器组装一个HTTP(TCP)请求报文
6.进行DNS查询


分为两种查询方式
6.1 迭代查询.先查询本地域名服务器依次根域名服务器、本地、顶级域名服务器、本地、权限域名服务器
6.2 递归查询.先查询本地域名服务器依次根域名服务器、顶级域名服务器、权限域名服务器
7.通过DNS查询拿到域名对应IP地址,就可以通过三次握手建立TCP连接了
7.1 客户端发送一个包含SYN=1,seq=x(唯一串,自身数据通讯初始序号)至服务器端口的TCP包,进入SYN-SEND状态
7.2 服务器发出包含SYN=1,ACK = x+1 ,seq=y(唯一串,自身数据通讯初始序号)的响应包,进入SYN-RECEIVED状态
7.3 客户端收到连接同意的应答后,还要向服务端发送确认报文。客户端发完这个报文后进入ESTABLISHED状态,服务端收到确认后也进去ESTABLISHED状态,此时连接成功建立

  1. 此时客服端可以开始发送HTTP请求,服务端收到请求并解析,此时可能需要检查HTTP请求头是否包含验证缓存验证信息,如有缓存则返回304等状态码。反之处理程序读取完整请求并准备HTTP响应,可能需要查询数据库等操作。操作完了则将响应报文通过TCP连接发回浏览器
  2. 浏览器接收HTTP响应,然后根据情况选择关闭TCP连接或者保持重用,关闭连接则需要四次挥手
    9.1 第一次挥手:若客户端认为数据发送完成 ,则它需要向服务端发送连接释放请求,标志FIN
    9.2 第二次挥手:服务端收到连接释放请求时后,会告诉应用层要释放TCP连接。然后发送ACK包,包含FIN并
    进入CLOSE_WAIT状态,表示客户端到服务端的连接已经释放,不接收数据了。但是因为TCP连接是双向
    的,所以服务端仍然可以发送数据给客户端。
    9.3 第三次挥手:服务端如果此时还有未发送完的数据会继续发送,完毕后会向客户端发送连接释放请求。然
    后服务端进入LASE-ACK状态
    9.4 客户端收到释放请求后,向服务端发送应答,此时客户端进入TIME_WAIT状态。该状态会持续2MSL(最大
    段生存期,指报文在网络中生存的时间,超时会被抛弃)时间,若该时间段内没有服务端的重发请求的话,就进入CLOSED状态。当服务端收到应答后,也进入CLOSED状态
    10.浏览器检查响应码,是否为1XX,3XX,4XX,5XX,这些情况处理与200不同
    10.1 如果资源可缓存,则进行缓存
    10.2 对响应进行解码(如gzip等),然后根据资源类型决定如何处理
    10.3 假设为资源为HTML文档,则从上至下开始解析,同时构建DOM树和CSS树,碰到script标签则阻塞,先执行JS代码(渲染引擎与JS引擎互斥),碰到IMG等则开始下载资源。解析完毕将DOM树与CSS树合成渲染树,进行页面的布局及重绘
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 194,670评论 5 460
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 81,928评论 2 371
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 141,926评论 0 320
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 52,238评论 1 263
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 61,112评论 4 356
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 46,138评论 1 272
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 36,545评论 3 381
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 35,232评论 0 253
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 39,496评论 1 290
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 34,596评论 2 310
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 36,369评论 1 326
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 32,226评论 3 313
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 37,600评论 3 299
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 28,906评论 0 17
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 30,185评论 1 250
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 41,516评论 2 341
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 40,721评论 2 335