专栏首页javascript艺术浏览器输入url访问网站的全过程

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

浏览器输入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交互

本文分享自微信公众号 - javascript艺术(gh_4e5484fd6b52),作者:zhangjing

原文出处及转载信息见文内详细说明,如有侵权,请联系 yunjia_community@tencent.com 删除。

原始发表时间:2021-04-07

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 浏览器中输入 URL 到网页显示的过程

    happyJared
  • 浏览器输入域名网址访问后的过程详解

    1、客户端浏览器通过DNS解析到https://www.fgba.net/,IP地址是202.108.22.5,通过这个IP地址找到客户端到服务器的路径。客户端...

    曾高飞
  • 浏览器中网址访问过程详解

    (1)浏览器本身是一个客户端,当你输入URL的时候,首先浏览器会去请求DNS服务器,通过DNS获取相应的域名对应的IP 

    py3study
  • 浏览器访问一个网站所经历的步骤

    搜索操作系统自身的DNS缓存(浏览器没有找到缓存或缓存已经失效)

    思梦php
  • 浏览器访问一个网站所经历的步骤

      搜索操作系统自身的DNS缓存(浏览器没有找到缓存或缓存已经失效)

    思梦php
  • 在浏览器输入网址到网页打开数据经过的过程

    第1次握手:客户端通过将一个含有“同步序列号(SYN)”标志位的数据段发送给服务器

    MickyInvQ
  • 从输入 URL 到浏览器接收的过程中发生了什么事情?

    首先是「输入 URL」,大部分人的第一反应会是键盘,不过为了与时俱进,这里将介绍触摸屏设备的交互。

    哲洛不闹
  • 服务器端请求伪造——SSRF

    SSRF(Server-Side Request Forgery:服务器端请求伪造) 是由攻击者构造形成的由服务端发起请求的一个安全漏洞。

    宸寰客
  • 竞争激烈的互联网时代,是否需要注重一下WEB安全?

    一直以来自己对WEB安全方面的知识了解的比较少,最近有点闲工夫了解了一下。也是为了以后面试吧,之前就遇到过问WEB安全方面的问题,答的不是很理想,所以整理了一下...

    拾贰
  • 常见的Web安全漏洞及测试方法介绍

    Web应用一般是指B/S架构的通过HTTP/HTTPS协议提供服务的统称。随着互联网的发展,Web应用已经融入了我们的日常生活的各个方面。在目前的Web应用中...

    小老鼠
  • 常见的Web安全漏洞及测试方法介绍

    Web应用一般是指B/S架构的通过HTTP/HTTPS协议提供服务的统称。随着互联网的发展,Web应用已经融入了我们的日常生活的各个方面。在目前的Web应用中,...

    数澜科技
  • 爬虫基础知识点

    学习爬虫之前需要了解的基础知识,如HTTP、爬虫、代理的基本原理等内容,对爬虫没有任何了解的小伙伴建议好好看看我分享的内容。

    stormwen
  • 测试大佬总结:Web安全漏洞及测试方法

    web应用一般是指B/S架构的通过HTTP/HTTPS协议提供服务的统称。在目前的Web应用中,大多数应用不都是静态的网页浏览,而是涉及到服务器的动态处理。如...

    小老鼠
  • 单点登录与权限管理本质:cookie安全问题

    继续介绍「单点登录与权限管理」系列的第一部分:单点登录与权限管理本质,前一篇文章介绍了单点登录概念,以CAS协议的基本流程为例讲解了系统间的交互过程,过程中,c...

    情情说
  • 爬虫基本介绍

    版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。 ...

    xbhog
  • Python入门网络爬虫之精华版

    首先列举一下本人总结的相关文章,这些覆盖了入门网络爬虫需要的基本概念和技巧:宁哥的小站-网络爬虫

    IT派
  • 一文搞懂Web常见的攻击方式

    Web攻击(WebAttack)是针对用户上网行为或网站服务器等设备进行攻击的行为

    @超人
  • Chrome 90 正式版发布:倒也没啥变化

    最近,谷歌 Chrome 90 浏览器正式版已经逐步向 Windows、MacOS、Linux 和移动设备用户推送。

    崔庆才
  • Firefox for iOS浏览器的二维码扫码XSS漏洞

    在手机中,我们通常访问一个网站的做法是打开浏览器在地址栏中输入网站地址,一般来说这样的方法有些烦人,所以,有些网站访问对象通常也会生成一个二维码图片,方便用户直...

    FB客服

扫码关注云+社区

领取腾讯云代金券