前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >浏览器输入url访问网站的全过程

浏览器输入url访问网站的全过程

作者头像
javascript艺术
发布2021-05-28 14:16:54
1.7K0
发布2021-05-28 14:16:54
举报
文章被收录于专栏:javascript艺术

浏览器输入url访问网站的全过程

  • 当输入url时,浏览器作为客户端首先会请求DNS服务器,通过DNS获取相应的域名和IP(应用层)
  • 通过IP地址找到对应的服务器,然后建立TCP连接
  • 浏览器向服务端发送http请求包(应用层 -> 传输层 -> 网络层 -> 数据链路层))
  • 服务端接受到http请求包后开始处理请求包(数据链路层 -> 网络层 -> 传输层 -> 应用层)
  • 在服务器收到请求之后,服务器调用自身服务,返回响应包
  • 浏览器接收到响应包后开始进行页面的渲染

网络通信

互联网内各网络设备间的通信都遵循TCP/IP协议,利用TCP/IP协议族进行网络通信时,会通过分层顺序与对方进行通信。

分层由高到低分别为:应用层、传输层、网络层、数据链路层。发送端从应用层往下走,接收端从数据链路层网上走。如图所示

在浏览器中输入url

在浏览器中输入的是一个网址,是不能直接用来进行连接的,因而就要使用DNS地址解析将输入的URL网址转换为IP地址。

浏览器先查看浏览器缓存-系统缓存-路由器缓存,如果缓存中有,会直接在屏幕中显示页面内容。若没有则在发送http请求前,需要域名解析(DNS解析),解析获取相应的IP地址

建立TCP连接

在TCP/IP协议中,TCP协议提供可靠的连接服务,采用三次握手建立一个连接.

第一次握手:建立连接时,client发送syn包到server

第二次握手:server收到client的syn包,使用ack回复client的syn包,同时server也会发送syn包.所以server回复ack+syn

第三次握手:client收到server的syn+ack包,使用ack确认服务器的syn包

至此,完成三次握手,client与server完成TCP连接的建立

浏览器(应用层客户端)发送http请求

http请求信息由3部分组成:

请求方法URI协议/版本

  • GET/POST/PUT/DELETE/OPTIONS 请求头(Request Header)
  • User-Agent
  • content-type
  • content-length
  • content-encoding
  • cache-contro

请求正文

  • queryString
  • form
  • application/json

TCP传输报文(传输层)

位于传输层的TCP协议为传输报文提供可靠的字节流服务。 它为了方便传输,将大块的数据分割成以报文段为单位的数据包进行管理,并为它们编号,方便服务器接收时能准确地还原报文信息(MTU)。

TCP协议确认保证传输的安全可靠的方式:

  • ack确认
  • 超时重传
  • 连接管理

服务器返回响应的文件

client收到http的response,使用http协议解析 Http Response:

  • Response Header
  • Content_Type: html/css/js/img/mp3/mp4/m3u8
  • Response Body

HTML构建DOM树 –> 解析css构建渲染树 -> 加载js -> client和server通过ajax交互

本文参与 腾讯云自媒体同步曝光计划,分享自微信公众号。
原始发表:2021-04-07,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 javascript艺术 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
相关产品与服务
云服务器
云服务器(Cloud Virtual Machine,CVM)提供安全可靠的弹性计算服务。 您可以实时扩展或缩减计算资源,适应变化的业务需求,并只需按实际使用的资源计费。使用 CVM 可以极大降低您的软硬件采购成本,简化 IT 运维工作。
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档