天天看点

一张图说明访问网站的流程一张图说明访问网站的流程

最近看了一些关于web请求资源方面的知识,自己总结了一个流程图,描述了打开浏览器访问一个网站到网站被渲染出来的流程,希望对大家的学习有所帮助~

另外,给大家推荐一款画图很好用的chrome插件 gliffy ,我博客里的图大部分都是用它画的,非常的好用,而且是离线的,大家可以试试。

因为是流程图的原因,大体的流程是ok的,但是其实里面还有一些细节没有涉及到,还请大神多多补充~

浏览器不管是访问jsp、php还是asp.net,整体流程几乎是一样的。

根据主机名,会首先查找ip,首先查询hosts文件,成功则返回其对应ip地址,如果没有查询到,则去查询dns服务器,成功就会返回ip,否则会报告连接错误。

在host中有这么几句

所以访问localhost是本机ip,如果这里改掉ip,localhost就会访问其他的ip

比较有意思的是,如果把localhost改成百度,那么访问百度的时候就会访问本机ip

这里是有一些安全机制的,浏览器是会提醒host文件异常的。

浏览器会把自身相关信息与请求相关信息封装成http请求消息改送给服务器。

服务器读取http请求中的内容,在经过解析主机,解析站点名称,解析访问资源后,会查找相关资源,如果查找成功,则返回状态码200,失败就会返回大名鼎鼎的404,在服务器监测到请求不存在的资源后,可以按照程序员设置的跳转到别的页面。所以有各种各样的404错误页面。

在服务器请求资源的过程中,如php文件会在服务器运行之后再返回。所以php等后台脚本是在服务器运行的。

一张图说明访问网站的流程一张图说明访问网站的流程

服务器会将请求的资源封装成http响应

浏览器得到返回数据后可以会提取数据,然后调用解析内核进行翻译,最后显示出页面。

之后浏览器会对其引用的文件比如图片,css,js等文件不断进行上述过程,直到所有文件都被下载下来之后,网页就会显示出来。

为了让大家看得更清楚,就加了一个标签,图片可能会横向出去,但是也比看不清强。

一张图说明访问网站的流程一张图说明访问网站的流程

这里附上原图以及gliffy 原文件的下载地址:

<a href="http://download.csdn.net/detail/sunmc1204953974/9287599">http://download.csdn.net/detail/sunmc1204953974/9287599</a>

gliffy文件需要使用chrome插件gliffy打开

希望对大家的学习有所帮助~