从URL输入到页面展现 1.输入URL

URL:统一资源定位符，是对可以从互联网上得到的资源的位置和访谒要领的一种简洁的暗示。

URL包罗以下几部分：协议、处事器名称(或IP地点)、路径、参数和盘问。

举例说明：

常用协议：

协议 中文名称 默认端标语
http   超文本传输协议   80  
https   用安适套接字层传送的超文本传输协议   443  
ftp   文件传输协议   21  
TELNET   长途终端协议   23  

如果地点不包罗端标语，按照协议的默认端标语确定一个。

2.按照URL，，在本地DNS缓存中查找域名对应的IP地点

浏览器和操纵系统在获取网站域名的实际IP地点后会对其IP进行缓存，在短时间内反复访谒同一域名时，会直接在DNS缓存中读取域名对应的IP地点，以减少网络请求的损耗（先在浏览器DNS缓存中查找，如果没有找到，则会在操纵系统DNS缓存中查找）。浏览器和操纵系统都有一个固定的DNS缓存时间，此中Chrome的过期时间是1分钟，在这个期限内不会从头请求DNS。Chrome浏览器看自己的DNS缓存时间对照便利，在地点栏输入:

chrome://net-internals/#dns

就可以检察本地DNS缓存：

3.盘问hosts文件

如果在本地DNS缓存中没有找到域名对应的IP地点，则会盘问hosts文件，看此中是否已经有与当前域名对应的 IP 地点，如果有就会直接给与，如果没有，那么就得由DNS处事器进行域名解析完成域名与IP的转换事情。

4.域名解析

域名系统DNS(Domain Name System)：用来把人们使用的域名转换为IP地点的系统。它是一个联机漫衍式数据库系统，给与客户处事器方法。

域名到IP地点的解析：当浏览器需要把域名解析为IP地点时，会挪用解析措施，并成为DNS的一个客户，把带解析的域名放在DNS请求报文中，以UDP用户数据报方法发送给本地域名处事器可以是路由器或者是运营商处事器）。本地域名处事器在查找域名后，把对应的IP地点放在回答报文中返回。浏览器在获取相应的IP地点后即可进行下一步的通信。

若本地域名处事器查找不到对应的IP，则此域名处事器就暂时成为DNS中的另一个客户，并向其他域名处事器发出盘问请求。这种过程直至找到能够回答该请求的域名处事器为止。

5.浏览器与处事器成立连接，并发送请求给处事器

当浏览器得到域名对应的IP地点后，则会使用TCP协议，和处事器成立连接（三次握手）。

和处事器成立连接后，浏览器则会使用相关协议(http或https)，向处事器发送请求。

HTTP协议请求要领主要有：get、post、put、delete等几种方法。

6.处事器收到请求并措置惩罚惩罚，最后返回功效

处事器是一台安置系统的机器，常见的系统如Linux、windows server 2012，系统中安置的措置惩罚惩罚请求的应用叫Web server。常见的Web处事器有 Apache、Nginx、IIS、Lighttpd，Web处事器接收用户的请求，或者接受请求反向代办代理到其他Web处事器。

(以MVC框架为例)当处事器收到来自用户的请求后，首先Controller(控制器)按照用户的请求挪用相应的Model(模型)去措置惩罚惩罚用户请求相关的业务逻辑(包孕对数据库的增删改查)，然后将措置惩罚惩罚功效通报给对应的View(视图)，结构显示页面(HTML文件)。最后处事器使用HTTP响应返回相应的资源(HTML文件)。

7.浏览器措置惩罚惩罚响应

浏览器收到来自处事器的响应后，会将响应中的HTML字符串一句句读取解析，解析到link标签后从头发送请求下载css文件，解析到script标签后从头发送请求下载js文件，并执行代码，解析到img标签后从头发送请求获取图片资源。

浏览器按照html、css计算得到衬着树，结合相关js的执行功效，最终将网页绘制到屏幕上，。

在查找资料的过程中，看到一篇简单易懂还挺有趣的文章：

HTML页面加载和解析流程

用户输入网址（假设是个html页面，并且是第一次访谒），浏览器向处事器发出请求，处事器返回html文件；

浏览器开始载入html代码，发明＜head＞标签内有一个＜link＞标签引用外部CSS文件；

浏览器又发出CSS文件的请求，处事器返回这个CSS文件；

浏览器继续载入html中＜body＞部分的代码，并且CSS文件已经拿得手了，可以开始衬着页面了；

浏览器在代码中发明一个＜img＞标签引用了一张图片，向处事器发出请求。此时浏览器不会等到图片下载完，而是继续衬着后面的代码；

处事器返回图片文件，由于图片占用了必然面积，影响了后面段落的排布，因此浏览器需要回过头来从头衬着这部分代码；

浏览器发明了一个包罗一行Javascript代码的＜script＞标签，赶忙运行它；