浏览器输入URL那些事

427 阅读4分钟

1113510-20170614182256790-1747672277.png

大概的总览

  1. 合成URL
  2. DNS域名解析
  3. 建立TCP连接(三次握手)
  4. 发送HTTP请求,服务器处理请求,返回对应的结果
  5. 关闭TCP连接(四次挥手)
  6. 浏览器渲染

用户输入url

浏览器会根据你输入的是内容,会根据搜索引擎合成新的URL。如果用户输入的符合url规则, 浏览器会根据URL协议,在这段内容加上协议合成合法的协议。

栗子:比如输入www.baidu.com 地址栏会根据规则,把这段内容加上协议,合成完整的URL,如www.baidu.com

浏览器如何通过DNS查找域名对应的IP

  1. 浏览器缓存:浏览器会按一定的频率去缓存DNS记录。
  2. 操作系统缓存:如果浏览器中没有找到对应的缓存,就去操作系统中找。
  3. 路由缓存:路由器也有对应的DNS缓存
  4. ISP的DNS服务器:ISP是互联网服务提供商(Internet Service Provider)的简称,ISP有专门的DNS服务器应对DNS查询请求。
  5. 根服务器:ISP的DNS服务器还找不到的话,它就会向根服务器发出请求,进行递归查询(DNS服务器先问根域名服务器.com域名服务器的IP地址,然后再问.com域名服务器,依次类推)

1626492567(1).png

HTTP请求流程

知识回顾:

  1. HTTP1.1与HTTP2的区别在于多路复用。 多路复用:通过单一的HTTP/2连接请求发起多重的请求-响应消息,多个请求stream共享一个TCP连接,实现多留并行而不是依赖建立多个TCP连接。具体可以参考下图

image.png

  1. HTTP与HTTPS的区别? http:无状态,无连接,基于请求和响应,通信使用明文、请求和响应不会对通信方进行确认、无法保护数据的完整性

https:基于HTTP协议,通过SSL或TLS提供加密处理数据、验证对方身份以及数据完整性保护。混合加密,中间者无法查看中间明文内容,双方由数字证书进行加密与解密,确保传输过程中,不会被窃取和篡改。

  1. HTTP和TCP的关系? 浏览器使用 HTTP 协议作为应用层协议,用来封装请求的文本信息;并使用 TCP/IP 作传输层协议将它发到网络上,所以在 HTTP 工作开始之前,浏览器需要通过 TCP 与服务器建立连接。也就是说 HTTP 的内容是通过 TCP 的传输数据阶段来实现的。

回到http请求知识点上

当DNS域名解析获取到IP地址后,端口通过TCP/IP协议建立连接。

image.png 三次握手:

image.png 为什么需要三次握手呢?为了防止已失效的连接请求报文段突然又传送到了服务端,因而产生错误。

比如:client发出的第一个连接请求报文段并没有丢失,而是在某个网络结点长时间的滞留了,以致延误到连接释放以后的某个时间才到达server。本来这是一个早已失效的报文段,但是server收到此失效的连接请求报文段后,就误认为是client再次发出的一个新的连接请求,于是就向client发出确认报文段,同意建立连接。假设不采用“三次握手”,那么只要server发出确认,新的连接就建立了,由于client并没有发出建立连接的请求,因此不会理睬server的确认,也不会向server发送数据,但server却以为新的运输连接已经建立,并一直等待client发来数据。所以没有采用“三次握手”,这种情况下server的很多资源就白白浪费掉了。

四次挥手:

image.png 为什么需要四次挥手呢?

TCP是全双工模式,当client发出FIN报文段时,只是表示client已经没有数据要发送了,client告诉server,它的数据已经全部发送完毕了;但是,这个时候client还是可以接受来server的数据;当server返回ACK报文段时,表示它已经知道client没有数据发送了,但是server还是可以发送数据到client的;当server也发送了FIN报文段时,这个时候就表示server也没有数据要发送了,就会告诉client,我也没有数据要发送了,如果收到client确认报文段,之后彼此就会愉快的中断这次TCP连接。

渲染阶段

渲染进程对文档进行页面解析和子资源加载,HTML 通过HTM 解析器转成DOM Tree(二叉树类似结构的东西),CSS按照CSS 规则和CSS解释器转成CSSOM TREE,两个tree结合,形成render tree(不包含HTML的具体元素和元素要画的具体位置),通过Layout可以计算出每个元素具体的宽高颜色位置,结合起来,开始绘制,最后显示在屏幕中新页面显示出来。

参考文章

www.cnblogs.com/geaozhang/p…
juejin.cn/post/684668…
juejin.cn/post/684490…
juejin.cn/post/684490…