在浏览器中输入URL地址到显示主页全过程

在浏览器中输入URL地址到显示主页全过程

一、浏览器查找域名的IP地址——DNS解析二、与服务器建立连接三、发送HTTP请求1、http协议2、HTTP请求报文 四、服务器处理请求并返回HTTP报文五、浏览器解析渲染页面六、断开TCP连接

其中涉及的协议如下图： 该过程一共有七个步骤：

一、浏览器查找域名的IP地址——DNS解析

DNS解析就是一个递归查询过程： 比如域名：www.baidu.com., 1、先在本地域名服务器中查询IP地址，如果没有会向根服务器发送请求； 2、根域名服务器不存在该域名时，给出对应的.com顶级域名服务器； 3、顶级域名服务没有，则会继续返回下一级域名服务器，依次类推下去 4、直到返回域名对应的IP地址 网址真正的解析过程是：.->.com.->baidu.com.->www.baidu.com. DNS存在多级缓存：浏览器缓存、系统缓存、路由器缓存、IPS服务器缓存、根域名服务器缓存、顶级域名服务器缓存、主域名服务器缓存。

二、与服务器建立连接

TCP连接三次握手过程

三、发送HTTP请求

1、http协议

HTTP是一个客户端和服务器端请求和应答的标准（TCP）。客户端是终端用户，服务器端是网站。通过使用Web浏览器、网络爬虫或者其它的工具，客户端发起一个到服务器上指定端口（默认端口为80）的HTTP请求，也就是计算机通过网络进行通信的规则，是一个基于请求与响应，无状态的，应用层的协议，常基于TCP/IP协议传输数据。

2、HTTP请求报文

一个HTTP请求报文由请求行、请求报头和请求正文三部分组成

请求行=请求方法+请求地址+协议版本

比如：GET index.html HTTP/1.1

请求方法：GET、POST、PUT、DELETE、PATCH、HEAD、OPTIONS、TRACE。 请求地址：<协议>://<主机>:<端口>/<路径>注意：端口和路径有时可以省略

eg:https://localhost:8080/index.html?key1=value1&keys2=value2

协议版本：HTTP/主版本号.次版本号，常用的有HTTP/1.0和HTTP/1.1 请求报头：允许客户端向服务器传递请求的附加信息和客户端自身的信息,常见的请求报头有: Accept, Accept-Charset, Accept-Encoding, Accept-Language, Content-Type, Authorization, Cookie, User-Agent等 请求正文:当使用POST, PUT等方法时，通常需要客户端向服务器传递数据。这些数据就储存在请求正文中

POST 　/index.php　HTTP/1.1 　　 请求行 Host: localhost User-Agent: Mozilla/5.0 (Windows NT 5.1; rv:10.0.2) Gecko/20100101 Firefox/10.0.2　　请求头 Accept: text/html,application/xhtml+xml,application/xml;q=0.9,/;q=0.8 Accept-Language: zh-cn,zh;q=0.5 Accept-Encoding: gzip, deflate Connection: keep-alive Referer: http://localhost/ Content-Length：25 Content-Type：application/x-www-form-urlencoded 　　空行 username=aa&password=1234　　请求数据

四、服务器处理请求并返回HTTP报文

HTTP相应报文三部分：状态码、响应报头、响应报文 1、状态码 三位数组成，第一位定义了类别，如下五种： 常见的状态码：

状态码意思状态码意思200服务器成功返回网页204请求收到，但返回信息为空301删除请求数据304客户端已经执行了GET，但文件未变化400错误请求，如语法错误401请求授权失败403请求不允许404请求的网页不存在500服务器产生内部错误503服务器超时过载或暂停维修

2、响应报头 常见的响应报头字段有: Server, Connection… 3、响应报文 服务器返回给浏览器的文本信息，通常HTML, CSS, JS, 图片等文件就放在这一部分

HTTP/1.1 200 OK　　状态行 Date: Sun, 17 Mar 2013 08:12:54 GMT　　响应头部 Server: Apache/2.2.8 (Win32) PHP/5.2.5 X-Powered-By: PHP/5.2.5 Set-Cookie: PHPSESSID=c0huq7pdkmm5gg6osoe3mgjmm3; path=/ Expires: Thu, 19 Nov 1981 08:52:00 GMT Cache-Control: no-store, no-cache, must-revalidate, post-check=0, pre-check=0 Pragma: no-cache Content-Length: 4393 Keep-Alive: timeout=5, max=100 Connection: Keep-Alive Content-Type: text/html; charset=utf-8 　　空行 　　响应数据 HTTP响应示例 Hello HTTP!

五、浏览器解析渲染页面

浏览器是一个边解析边渲染的过程。首先浏览器解析HTML文件构建DOM树，然后解析CSS文件构建渲染树，等到渲染树构建完成后，浏览器开始布局渲染树并将其绘制到屏幕上。这个过程比较复杂，涉及到两个概念: reflow(回流)和repain(重绘)。DOM节点中的各个元素都是以盒模型的形式存在，这些都需要浏览器去计算其位置和大小等，这个过程称为relow;当盒模型的位置,大小以及其他属性，如颜色,字体,等确定下来之后，浏览器便开始绘制内容，这个过程称为repain。页面在首次加载时必然会经历reflow和repain。reflow和repain过程是非常消耗性能的，尤其是在移动设备上，它会破坏用户体验，有时会造成页面卡顿。所以我们应该尽可能少的减少reflow和repain.

六、断开TCP连接

TCP四次挥手