从输入URL网址到页面呈现发生了什么

文章很多都是参考别人的,然后自己进行了大概的总结。大概的整个过程如下:

  1. 浏览器的地址栏输入URL并按下回车。
  2. DNS解析URL对应的IP。
  3. HTTP发起请求。
  4. 根据IP建立TCP连接(三次握手)。
  5. HTTP发起请求。
  6. 服务器处理请求。
  7. 浏览器接收HTTP响应。
  8. 渲染页面,构建DOM树。
  9. 关闭TCP连接(四次挥手)。

一、URL地址输入

输入网址:baidu.com,网址自动跳转为https://www.baidu.com

此时,URL网址分为了:协议、域名、端口号,这里的端口号是默认所以隐藏了。此外,URL还会包含一些路径、查询等其他片段,如:https://www.baidu.com/s?ie=utf-8&f=3...

  • 协议:从该计算机获取资源的方式,有HTTP协议、加密的HTTPS协议、FTP协议及FILE协议等,不同协议有不同的通讯内容格式。

  • 域名:URL的中间部分为域名,一般我们都是通过域名查找网站,因为域名简单好记。

  • 端口号:端口号不常见是因为大部分都是使用的默认端口,如HTTP默认端口号为80/8080,HTTPS默认为443/tcp 443等。

二、域名解析

当我们在浏览器输入一个url时,这个地址并不是真正意义上的地址。互联网上每一台计算机的唯一标识是它的IP地址,因此我们输入的网址需要先解析为IP地址,这个过程叫DNS解析

DNS解析过程的具体查找方式为:

  • 浏览器缓存: 浏览器会缓存DNS记录一段时间。当用户输入一个url地址,首先会在浏览器缓存中查找是否有该域名对应的IP地址,如果有,则直接返回该IP地址。当然,不同浏览器一般都有一个自固定的缓存时间(2分钟到30分钟不等);

  • 系统缓存: 一般在浏览器缓存栗没有找到需要的记录,浏览器会查找系统缓存,查看本地C盘中的hosts文件上是否有对应IP地址,如果有,则返回IP;同样,如果有病毒把一些常用的域名,修改 hosts 文件,指向一些恶意的 ip,那么浏览器也会不加判断的去连接,这正是很多病毒的惯用手法。

  • 路由器缓存: 在系统缓存中没有查询到IP,浏览器将会将请求发给路由器,它一般会有自己的DNS缓存信息;

  • ISP DNS缓存: 如果路由器缓存中也没有查询到IP地址,接下来要查询的就是本地DNS服务器缓存,本地DNS服务器一般是由为用户提供互联网接入服务的运营商提供,如果在本地DNS服务缓存中找到了,则返回IP地址,这个过程是以递归方式进行的;

  • 递归搜索: 如果以上方式都没有查询到IP地址,那你的ISP的DNS服务器将从根域名服务器开始进行递归搜索,从.com顶级域名服务器到百度的域名服务器,然后依次返回IP地址。

※ 默认情况下,DNS服务器使用递归方式来解析IP地址,如果你禁止DNS服务器使用递归方式,则DNS服务器使用迭代方式工作。

知识扩展:

1)什么是DNS?

DNS(Domain Name System,域名系统),因特网上作为域名和IP地址相互映射的一个分布式数据库,能够使用户更方便的访问互联网,而不用去记住能够被机器直接读取的IP数串。通过主机名,最终得到该主机名对应的IP地址的过程叫做域名解析(或主机名解析)。

简单来讲就是将域名和IP地址进行翻译,比如www.baidu.com更方便记忆,而IP地址却不方便记忆。计算机的唯一标识就是它的IP地址,所以最终计算机是通过IP地址找到对应资源。

2)DNS查询的两种方式:递归查询和迭代查询

  1. 递归解析
    客户端主机向本地DNS服务器进行递归查询,然后本地DNS服务器先向该域名的根域服务器查询,再由根域名服务器一级级向下查询。最后得到的查询结果再一级级返回给本地DNS服务器,客户端主机再得到本地DNS服务器返回的IP地址。递归查询的结果要么是返回的IP地址,要么是报错,表示无法查询到地址;

    递归查询

  2. 迭代解析
    当本地DNS服务器自己不能回答客户端主机的DNS查询时,也可以通过迭代查询的方式进行解析。本地DNS服务器向根域名服务器发起查询请求,根域名服务器会返回顶级域名服务器的信息,让本地DNS服务器去查询,本地DNS服务器会继续向顶级域名服务器发出请求,得到IP地址信息,或者得到下一步向哪个权限域名服务器请求的信息,直到找到IP地址或找不到IP返回报错信息,然后将信息返回给客户端主机。也就是说,迭代解析只是帮你找到相关的服务器而已,而不会帮你去查。

    迭代查询

    3)域名服务器的划分

  3. 根域名服务器
    就是所谓的“.”,网址www.baidu.com在配置当中应该www.baidu.com.(最后有一点),一般我们在浏览器里输入时会省略后面的点,而这也已经成为了习惯。全球总共有13个根域名服务器的地址,但机器数量却不是13台,它是最重要的域名服务器,它知道所有顶级域名服务器的域名和IP地址;

  4. 顶级域名服务器
    它有两种划分方式,一种互联网刚兴起时的按照行业性质划分的.com,.net等,一种是按国家划分的如.cn,.jp等;

  5. 权限域名服务器
    个人或组织在互联网上使用的注册名称,例如qq.com/baidu.com;

  6. 本地域名服务器
    每个因特网服务提供商ISP,或大学,甚至大学里的一个系,都可以拥有本地域名服务器。

三、TCP连接

得到 ip 地址后,浏览器会开始构造一个 http 请求,应用层的 http 请求准备好后,浏览器在传输层发起一条到达服务器的 tcp 连接,这个时候应该开始三次握手的过程。

该握手包括一个“同步报文”,一个“同步-应答报文”和一个“应答报文”,这三个报文在 浏览器和服务器之间传递。该握手首先由客户端尝试建立起通信,而后服务器应答并接受客户端的请求,最后由客户端发出该请求已经被接受的报文。

完成三次握手,客户端与服务器开始传送数据。三次握手的主要目的防止server端一直等待,浪费资源。

四、浏览器向web服务器发送http请求

浏览器 通过TCP/IP连接 向web服务器 发送一个 HTTP 请求,完整的HTTP请求包含请求起始行、请求头部、请求主体三部分。
  • 请求行:指定http请求的方法、url、http协议版本等。常用的方法有 GET 或者 POST 等,不常用的还有 PUT 和 DELETE 、HEAD、OPTION以及 TRACE ,一般的浏览器只能发起 GET 或者 POST 请求。
    eg: GET index.html HTTP/1.1
  • 请求头(Request Header):描述浏览器的相关信息,语言、编码等。
  • 请求正文:当发送POST, PUT等请求时,通常需要向服务器传递数据。这些数据就储存在请求正文中。

五、服务器处理HTTP请求

后端在固定的端口接收到TCP报文开始,它会对TCP连接进行处理,对HTTP协议进行解析,并按照报文格式进一步封装成HTTP Request对象,供上层使用。

一些大一点的网站会将你的请求到反向代理服务器中,因为当网站访问量非常大,网站越来越慢,一台服务器已经不够用了。于是将同一个应用部署在多台服务器上,将大量用户的请求分配给多台机器处理。此时,客户端不是直接通过HTTP协议访问某网站应用服务器,而是先请求到Nginx,Nginx再请求应用服务器,然后将结果返回给客户端。

这里Nginx的作用是反向代理服务器。同时也带来了一个好处,其中一台服务器万一挂了,只要还有其他服务器正常运行,就不会影响用户使用。

六、服务器返回一个 HTTP 响应

服务器处理完的结果以HTTP的Response对象返回,主要包括状态码,响应头,响应报文三个部分。

状态码主要包括以下部分:

状态码 释义
1xx 指示信息–表示请求已接收,继续处理。
. 100: Continue/继续 、 101: Switch Protocols/协议转换
2xx 成功–表示请求已被成功接收、理解、接受。
. 200: OK/正常 、 201: Create/已创建 、 202: Accepted/接受 、 203: Non-Authoritative Information/非官方信息 、 204: No Content/无内容、205: Reset Content/重置内容 、 206: Partial Content/局部内容。
3xx 重定向–要完成请求必须进行更进一步的操作。
. 300: Multiple Choices/多重选择、301: Moved Permanently/永久移动、302: Found/已找到、303: See Other/查看其他位置、304: Not Modified/未修改、305: Use Proxy/使用代理、 307: Temporary Redirect/临时重定向。
4xx 客户端错误–请求有语法错误或请求无法实现。
. 400: Bad Request/错误请求、401: Unauthorized/未授权、 403: Forbidden/禁止、 404: Not Found/未找到、405: Method Not Allowed/方法未允许、406: Not Acceptable/无法访问……
5xx 服务器端错误–服务器未能实现合法的请求。
. 500: Internal Server Error/内部服务器错误、501: Not Implemented/未实现502: Bad Gateway/网关错误、503: Service Unavailable/服务无法获得、504: Gateway Timeout/网关超时、505: HTTP Version Not Supported/HTTP 版本不支持。

具体状态码内容点此查看

响应头主要由Cache-Control、 Connection、Date、Pragma等组成。
响应报文为服务器返回给浏览器的信息,主要由HTML,css,js,图片文件组成。

七、浏览器页面渲染

浏览器接受到http服务器发送过来的响应头,此处如果浏览器访问过,缓存上有对应资源,会与服务器最后修改时间对比,一致则返回304;如果有修改或没有缓存,浏览器将开始下载解析html文档,渲染页面,同时使用缓存。具体的渲染过程包括:构建DOM树、构建渲染树、定位页面元素、绘制页面元素等。

DOM树节点

八、断开TCP连接

客户端与服务器四次挥手,断开tcp连接。

  • 第一次挥手:客户端想分手,发送消息给服务器;
  • 第二次挥手:服务器通知客户端已经接受到分手请求,但还没做好分手准备;
  • 第三次挥手:服务器已经做好分手准备,通知客户端;
  • 第四次挥手:客户端发送消息给服务器,确定分手,服务器关闭连接。
断开TCP连接

参考网址:
https://blog.csdn.net/qq_32657025/article/details/79672419
https://www.cnblogs.com/xianyulaodi/p/6547807.html
https://segmentfault.com/a/1190000006879700#articleHeader0
https://www.cnblogs.com/dinghuihua/p/6739340.html

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 213,417评论 6 492
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 90,921评论 3 387
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 158,850评论 0 349
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 56,945评论 1 285
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 66,069评论 6 385
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 50,188评论 1 291
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,239评论 3 412
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 37,994评论 0 268
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,409评论 1 304
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,735评论 2 327
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,898评论 1 341
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,578评论 4 336
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,205评论 3 317
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,916评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,156评论 1 267
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 46,722评论 2 363
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 43,781评论 2 351

推荐阅读更多精彩内容