浏览器输入网址到页面展示流程分析

一、主要流程

二、流程解析

1、URL

URL（Uniform Resource Locator,统一资源定位符）

协议

http —— 超文本传输协议

https —— 加密的超文本传输协议

files —— 本地文件传输协议

ftp ——文件传输协议

mailto —— 电子邮件地址

域名

用来确定服务器在互联网上的位置，域名的目的是便于记忆和沟通的一组服务器的地址，是唯一不可重复的

端口

区分服务类别和在同一时间进行多个会话

常用的协议和默认的端口号：

文件路径

用来表示主机上的一个目录或文件地址（即存储的位置），由零或多个“ / ”符号隔开，划分为多个层次进行描述

2、DNS域名解析

当你在浏览器中输入URL后，你使用的电脑会发出一个DNS请求（将域名转化为IP地址的请求）。对于浏览器，实际上并不知道"https://www.zhihu.com/people/xiao-lan-miao-37-19"到底是什么东西，需要确认其中域名所在服务器的IP地址才能找到目标网站（浏览器需要对IP地址进行识别，才能够进一步传递网址和信息内容）。那么，将域名解析成对应的服务器IP地址这项工作，就是由DNS服务器来完成

DNS（Domain Name System 域名系统）

DNS服务是位于应用层的协议，其提供域名到IP地址间的解析服务。把便于用户记忆的特定域名转换成为能够被机器直接读取的IP数串

IP地址（Internet Protocol Address 互联网协议地址）

图片来自《图解http》

域名解析的流程：

1.查找浏览器缓存——我们日常浏览网站时，浏览器会缓存DNS记录一段时间。如果以前我们访问过该网站，那么在浏览器中就会有相应的缓存记录。因此，我们输入网址后，浏览器会首先检查缓存中是否有该域名对应的IP信息。如果有，则直接返回该信息供用户访问网站，如果查询失败，会从系统缓存中进行查找。

2.查找系统缓存——从hosts文件中查找是否有存储的DNS信息（MAC端，可在“终端”中输入命令cat etc/hosts找到hosts文件位置），如果查询失败，可从路由器缓存中继续查找。

3.查找路由器缓存——如果之前访问过相应的网站，一般路由器也会缓存信息。如果查询失败，可继续从 ISP DNS 缓存查找。

4.查找ISP DNS缓存——从网络服务商（例如电信）的DNS缓存信息中查找

5.如果经由以上方式都没找到对应IP的话，则向根域名服务器查找域名对应的IP地址，根域名服务器把请求转发到下一级，逐层查找该域名的对应数据，直到获得最终解析结果或失败的相应。

3、服务器处理请求

浏览器通过IP地址找到对应的服务器，要求建立TCP链接，此时服务器开始处理用户请求

TCP ？

TCP是互联网中的传输层协议，提供可靠的链接服务，采用三次握手确认一个连接：

1.浏览器向服务器发送建立连接的请求

2.服务器接收到浏览器发送的请求后，向浏览器发送同意连接的信号

3.浏览器接受到服务器发出的同意连接的信号后，再次向服务器发出确认连接的信号

图片来自《图解http》

当三次握手返程，TCP客户端和服务端成功的建立连接，就可以开始传输数据了

综上所述，输入URL到服务器返回资源大致流程如下图:

图片来自《图解http》

4、网站处理流程

用户输入网址后向服务器发送内容请求，服务器接收到请求后触发Controller（控制器），控制器从Model（模型）和视图（View）中获取各种数据信息进行处理，最后视图（View）将数据渲染为HTML使得页面完整的呈献给用户

MVC：一种设计模式，全名是Model View Controller，是模型（Model）- 视图（View）- 控制器（Controller）的缩写

Model

应用程序中用于处理应用程序数据逻辑的部分

模型对象负责在数据库中存取数据

View

应用程序中处理数据显示的部分

Controller

应用程序中处理用户交互的部分

5、浏览器显示页面

HTML字符串被浏览器接收后被一句句读取解析

解析到link标签后重新发送请求获取CSS

解析到script标签后发送请求获取JS，并执行代码

解析到img标签后发送请求获取图片资源

浏览器根据HTML和CSS计算得到渲染书，绘制到屏幕上

JS会被执行，页面展现