拟人化简述浏览器访问网站的流程图

大家好,我是三玹!

有一段时间没写文章了,因为这段时间里感觉遇到瓶颈,有点江郎才尽,挤不出墨水来了,所以去找找新思路。真实原因才不是因为我懒~

好吧,一时摆烂一时爽,一直摆烂一直爽!

拟人化简述浏览器访问网站的流程

回归正题,这一段时间也确实在学一些新东西,学习了一下后端,关于网络编程的知识,准备搞个服务器玩玩。

先来一道开胃菜,咱来聊一聊关于正常浏览器访问网站的一个流程。

正文

当我们在网页的地址栏中输入一串网址,敲下回车,就会打开一个新世界。

例如:在浏览器的地址栏中输入百度网址 – ***,敲下回车就会获得在国内家喻户晓的一个界面。

拟人化简述浏览器访问网站的流程

这个界面虽然看着简单,但是看一下它的源代码,瞧着右上角高高悬挂的拉条,就知道这界面可一点儿都不简单。(查看源代码,右键网页界面点击查看网页源代码或者 ctrl+u。)

拟人化简述浏览器访问网站的流程

那么问题来了,在我们的电脑中是百分百找不到【百度界面】这个 HTML 文件,更不要说其中的图片、JS、CSS等资源文件。

可以知道的一点,这些资源肯定是百度网站提供的。那么,我们的浏览器是怎么从网站那边拿到这些数据,然后在页面上展示的呢?

拟人化简述浏览器访问网站的流程

在流程开始之前,简单介绍一些概念。

网站:是一个由多个网页组成的信息系统,通常是由服务器端和客户端组成的。

服务器端:网站的核心部分,通常服务器是一台大型的计算机,存储着网站所有的网页、图片、视频等信息。同时还负责处理来自客户端的请求,返回所需的信息。

客户端:网站的用户端,通常是一台普通的计算机、或者手机等,我们可以通过客户端访问网站查看网站的内容。另外,客户端通常需要借助浏览器等软件连接网站服务器。

拟人化简述浏览器访问网站的流程

第一步 客户端发送网页 GET 请求

当我们在浏览器的地址中输入网址,并敲下回车的那一刻。

就是在跟咱们的跑腿小厮浏览器发出了一个指令,今儿咱要看这个页面,你去安排一下。

浏览器收到我们的命令之后,就会朝着对应网站的服务器端出发。

第二步 服务器端接收请求,发送响应包

到了服务器端的大楼,进入大楼需要经过门卫的检查,确保你的浏览器是正常来路,而不是什么恐怖分子。

身份检查没问题后,就会给浏览器分配一个客服小姐姐接待:亲,有什么需要帮忙的吗?

浏览器此时会将你的指令转达给客服小姐姐:小姐姐,我家主子要看你家的这个网页,您看OK不?

小姐姐就会去找相应的页面资源文件(HTML文件),如果就交给浏览器带回去。

反之如果没有找到,但也不能让浏览器白跑一趟,就把经典的 404 页面让浏览器带回去。

第三步 客户端发送资源 GET 请求

浏览器拿到了页面资源回家后,一向严谨的他会检查一下拿到的页面是否能够完整地展示出来,会不会缺胳膊少腿。

不检查还好,一检查可就出大问题了,怎么这个CSS文件少了,那个图片还是破裂的。

就这么展示,今晚的晚饭岂不是没了着落。

没办法,只能带着有资源路径的 GET 请求再次到服务器端去领取。

第四步 服务器端接收请求,发送资源响应

于是,浏览器又得去一趟服务器端大楼,还得经过门卫的检查,毕竟门卫不敢保证你这回去的过程中是不是就突然叛变了呢。

检查通过后,之前负责接待的客服小姐姐就迎了上来。

根据浏览器提供的资源路径,去找相应的文件交给浏览器。

但浏览器一次性只能领一个资源,为了能吃上美美的晚饭,就不得不多次往返的跑。

直到整个界面的资源都领取了一遍,才敢将网页完整地展示出来。

基本到这里,一个完整的静态页面就可以在浏览器上展示出来了。

第五步 客户端发送 POST 请求

但有时候,我们进入一个网站需要登录,需要填写账号密码提交验证。

这个时候浏览器就会带着有账号密码的 POST 请求再次前往服务器端。

第六步 服务器接收请求,转交 CGI处理

客服小姐姐接到了 POST 请求,但这个请求超出她负责处理的范围。

因此就会代转交给专业人士 CGI 来进行处理。

CGI(Common Gateway Interface,通用网关接口)。

第七步 CGI发送处理结果

CGI 收到了请求后,将里面的账号密码和数据库里面的进行比较。

如果都符合,就会得到一个’登陆成功‘的处理结果。

如果没找到相应的账号,就会得到’账号不存在‘的处理结果

账号存在,但密码不对,就得到’密码错误‘的处理结果。

最后把处理结果交给客服小姐姐。

第八步 服务器端发送响应

客服小姐姐将CGI的处理结果转交给浏览器,浏览器带着结果回去。

如果处理结果是成功的,就可以发现界面中原本登录注册那一块,会变成头像、昵称等内容。

处理结果失败了,就会在登录页面中显示账号不存在或者密码错误等提示。

总结

到这里,关于浏览器访问网站获取页面资源的大致过程就介绍完了。

整个描述过程似乎看着很复杂,但实际上我们感官上体验其实也就 1-2 秒的。在正常情况,访问一个网站响应时间超过 5 秒,大多数人会选择关闭。

其中涉及到的一些知识点,如 GET 请求、POST 请求、CGI 等等;以及一些没提到但应该有的内容,如 DNS 解析、建立 TCP 请求时的三次握手等等。这些咱们后面一步一步,慢慢展开!

最后,大家要是喜欢本篇文章,还希望能够点个赞支持一下,谢谢!

1、***/pzjdoytt

声明:本网页内容旨在传播知识,若有侵权等问题请及时与本网联系,我们将在第一时间删除处理。E-MAIL:dandanxi6@qq.com

(0)
上一篇 2023年 6月 6日 上午10:09
下一篇 2023年 6月 6日 上午10:15

相关推荐

  • 便宜的全网通4g手机推荐,huawei nova 9 4g全网通

    【PConline 海选导购】不少消费者在购买手机时都会考虑产品的性能、外观等等,除了这些还有一点是必须要考虑的,那就是手机的网络制式。之前的手机大多数只支持比较少的网络制式,比如…

    2023年 3月 2日
  • 华为荣耀70手机价格及图片12+256

    上回7X从9.1降到8.0后,没几天,不知道怎么回事,自动更新什么的都关了,它还是自动升到了9.1,于是又是一顿操作,这一次让它永不更新。 手机用数据线连接电脑,连接方式选择传输文…

    2023年 3月 23日
  • iphone墨绿色配色什么时候出的

    上周,知乎一份关于新 iPhone 的爆料火了,其中一条「新 iPhone 新增墨绿色」成功拿下当天的头条,爆料中称,2019 款 iPhone 将新增材质为磨砂玻璃的墨绿配色,将…

    2023年 4月 27日
  • 你有多久没在app上k歌了

    前段时间,在线K歌产品“音街”APP宣布将于2022年9月30日关停,这一消息让不少人发出疑惑,在线K歌赛道的发展,真的就这么难吗?现在又还有哪些在线K歌产品还“存活”着?本篇文章…

    2023年 1月 7日
  • 如何玩转cad旋转类快捷键?教你转出新花样图纸

    我们经常看到CAD图纸里有很多对称的图像,他们是怎么被画出来的呢?告诉你,多数都是通过“转”,转出来的哦!请看我如何玩转CAD,转出一片新天地吧。 快捷键一:MI-镜像 我们知道,…

    2023年 12月 15日
  • 《王者荣耀》能隐身登陆吗知乎(王者荣耀有隐身功能吗)

    之前不久,《王者荣耀》很隐秘的更新出了隐身登录的功能,在之前很长一段时间不能够隐身登录,导致自己想好好打游戏的时候经常被好友打扰,而现在隐身登录的功能终于实现了。 现在,玩家可以在…

    2023年 3月 14日
  • 整理收纳衣橱的方法怎么解释

    做到这四步让家不复乱。但很多人做到第2步就已经开始流泪了,到第3步就已经崩溃了。看看你能坚持到哪个阶段?我保证完成这4步可以让我们的家再也不复乱,老公再也不出门!还有很多人因为这件…

    2023年 5月 5日
  • 文件过期还能找回来吗

    文件过期!一招轻松找回! 坏了坏了点点,老板给我发的文件,让他再给你发一份。我可不敢,老板知道又要扣我工资了,请我喝奶茶,一招教你轻松搞定。 没问题,找回来请你喝一周的奶茶。打开手…

    2023年 7月 16日
  • sata固态硬盘用ahci哪个最快

    2022年12日3日,开机蓝屏问题: 1、开机提示界面如下: 2、点击正常启动后蓝屏界面如下: 3、我的电脑是WIN7+固态硬盘,专家说可能是硬盘的SATA模式不对,于是重启电脑时…

    2023年 1月 2日
  • ps图片大小怎么调整?借助工具尺寸随心调整

    ps图片大小怎么调整?调整图片大小是为了适应不同的使用场景和要求,如网页设计、电子邮件和社交媒体,以便图片能够更好地发挥其作用。例如,适当调整图片大小可以确保图片在网页中正常显示,…

    2023年 8月 4日