在浏览器输入URL后的Web流程

我们在上网时，比如说想打开某个特定的网站，为了方便我们一般会在地址栏中输入网站的URL，我们在这里讨论的就是我们访问某个网页的具体步骤流程。

通信过程

我们通过浏览器上网是，浏览器就是我们的客户端，而我们所访问网站所在的服务器就是所谓的服务器端，有了客户端和服务器端之后我们就可以建立两者之间的通信了。通信大概分为三个步骤，如下：

1. 客户端（浏览器）向服务器端（远端服务器）发送请求，因为http是构建在TCP之上，那么自然是要经过3次握手创建连接
2.  创建连接后，服务器会根据url请求中的信息进行处理，作出响应，一般来说是找到一个html文件返回给客户端。
3.  客户端即浏览器得到html，进行渲染。

 下面详细解一下：

创建连接

 

• 对于http的客户端，它的输入就是一个url，

• 而对于创建连接，它需要的只是url的host（主机）部分，

• 而主机地址一般是网站的域名，所以第一步肯定是域名解析，也就是要通过DNS服务器进行域名解析得到网站的ip地址，然后向这个ip地址发送一个连接建立的请求，如果服务器接收到请求会返回一个确认，客户端得到确认再次发送确认，连接建立成功。

 服务器处理

建立好连接后，客户端就会发送http请求，请求信息包含一个头部和一个请求体，

一般的web技术都会把请求进行封装然后交给我们的服务器进行处理，比如servlet会把请求封装成httpservletrequest对象，把响应封装成httpsevletresponse对象。nodejs的http模块，当你创建服务器的时候会写一个回调函数，回调的参数用来接受http请求对象和响应对象，然后在回调函数中对请求进行处理。

在请求对象中我们可以得到path（路径），queryString（查询字符串），body（post请求中提交的数据）等。

对请求的处理就可以很复杂，也可以很简单。

我们可以根据path找到客户端想要的文件，读取这个文件，然后通过响应对象把内容返回给客户端，这个过程，不同的技术提供的api可能不同，尤其是用惯了MVC框架的人，可能只是指定一个文件，或者在配置文件中设置一下就好了。

但是最终的实现肯定是符合http响应标准的，也就是要有一个响应头和一个响应体。

我一般接触到的设置响应头就是设置content-type来决定MIME类型，设置Cache-Control，last-modify等缓存内容。

 

客户端渲染

客户端接收到服务器传来的响应对象，从中得到html字符串和MIME，根据MIME知道了要用页面渲染引擎来处理内容即html字符串，于是进入页面渲染阶段，这又是一个很庞杂的体系。我只能大体上说一下：

从浏览器的角度讲，它包含几大组件，网络功能（比如http的实现）算是其中之一，渲染引擎也是其中之一，还有其它的一些比如自己UI界面，javascript解释器，客户端数据存储等等。在这里我们主要关注渲染引擎和javascript解释器，对于web开发者来说，这才是浏览器的核心。