关于url放到浏览器,到网页的呈现,发生了什么,是我们经常遇到的一个面试题,当然从业前端几年后,不说完全懂,但是这确实是应该去了解的一个东西~
这篇博客,借鉴了不少的文章,以及视频,我把知识做一个全面的汇总,以及加上自己的一些理解,不好的地方,欢迎指出
一 url (统一资源路径地址)包含了哪些部分
例如: http://www.baidu.com/index.html?name=mo&age=25#dowell
1、传输协议：http,https
2、域名： 例www.baidu.com为网站名字。 baidu.com为一级域名，www是服务器
3、端口： 不填写的话默认走的是80端口号/443端口 (http默认80,https默认443)
4、路径 http://www.baidu.com/路径1/路径1.2。/表示根目录
5、携带的参数：？name=mo
6、哈希值：#dowell
二 https和http有什么区别
参考: https和http有什么区别
主要的区别体现在安全上,现在一般都是用的https
1、http协议：是超文本传输协议，信息是明文传输。如果攻击者截取了Web浏览器和网站服务器之间的传输报文，就可以直接读懂其中的信息。
2、https协议：是具有安全性的ssl加密传输协议，为浏览器和服务器之间的通信加密，确保数据传输的安全。
三 浏览器中输入url到请求到资源这个过程中发生了什么?
主要发生四个过程：查找 IP 、建立连接、相互通信、断开连接。主要流程概述如下
01 浏览器根据域名查找对应的 IP 地址
02 浏览器根据IP地址与服务器建立连接
03 浏览器和服务器互相通信
04 浏览器和服务器断开连接
3.1 基础概念
IP地址（Internet Protocol Address）
是指互联网协议地址，又译为网际协议地址。IP地址是IP协议提供的一种统一的地址格式，它为互联网上的每一个网络和每一台主机分配一个逻辑地址，以此来屏蔽物理地址的差异。
域名(Domain Name)
是由一串用点分隔的名字组成的Internet上某一台计算机或计算机组的名称，用于在数据传输时对计算机的定位标识（有时也指地理位置)
DNS （Domain Name Server）
域名系统，是互联网的一项服务。它作为将域名和 IP 地址相互映射的一个分布式数据库，能够使人更方便地访问互联网。
url
统一资源定位符，有时也被俗称为网页地址（网址）。指的是因特网上各种资源的地址。
这里需要区分一下域名（或者 IP 地址）与 URL 的区别，域名确定的是因特网中某台主机的位置；而 URL 则要更为具体，指某台主机中某个资源的具体位置。
我的记忆:
想找一个东西,必定要知道他的地址在哪里(IP地址),但是这个地址好难记哦,也没有什么标志,所以出现了代表这个ip的名字(域名),
那么地址和这个名字怎么关联起来呢?那就是通过一个名单(分布式数据库)里面的对象得知,将名字和地址相互映射(DNS解析), 我通过域名就能放问到那个地址,拿到我想要的网页
3.2 查找 IP 、建立连接、相互通信、断开连接的理解
查找 IP
在我们输入 URL 并且按下回车时，浏览器首先要做的便是通过域名查找对应的 IP 地址，这个过程也称作 DNS 解析。具体的查找过程如下：
浏览器搜索自己的 DNS 缓存，查找成功返回其对应 IP 地址，失败则进行下一步；
搜索系统中的 DNS 缓存，查找成功返回其对应 IP 地址，失败则进行下一步；
搜索系统中的 hosts 文件，查找成功返回其对应 IP 地址，失败则进行下一步；
系统发送一个请求到路由器上，路由器查找其缓存，查找成功返回其对应 IP 地址，失败则进行下一步；
系统将域名发送至 LDNS（本地域名服务器），查找成功返回其对应 IP 地址，失败则 LDNS 向 Root Name Server（根域名服务器）
发起请求获得域的顶级域名服务器地址，然后依次请求获得各级域名服务器地址，最后获得域名对应 IP 地址；
LDNS 将 IP 地址返回给操作系统并缓存起来；
系统将 IP 地址返回给浏览器并缓存起来；
浏览器获得 IP 地址，发起建立连接的请求。
建立连接--三次握手
浏览器向服务器发送想建立连接的请求
服务器向浏览器发送同意建立连接的响应
浏览器向服务器发送确认收到响应的请求，客户端和服务器建立连接
可以这样理解:
假设我(客户端),想和马爸爸(服务端)做生意,从他那里搞点年货过来,那么我首先要和他认识一下,建立生意伙伴关系( 建立连接),以邮件的方式(发请求)回复邮件(发送响应)
1.我向马云发送邮件(请求),我想和你建立生意伙伴关系(建立连接)
2.马云发送回复邮件(响应)同意和你建立生意伙伴关系(同意建立连接)
3.得到消息,我给马云发邮件(请求)说,收到你的回邮件(响应)了,现在我们做开始确认生意伙伴关系(建立连接)吧
相互通信
客户端与服务器建立连接后，便会开始进行通信，这里以客户端向服务器请求网页资源的过程为例：
浏览器向服务器发起一个请求网页资源的请求；
服务器返回对应网页资源；
浏览器渲染、构建网页，在构建网页的过程中，可能会继续请求 CSS、JavaScript 等资源。
可以这样理解,我和马爸爸已经是生意伙伴关系了,要交易了
我发邮件(请求)给马云说,给我点年货(网页资源)
马云发送回复邮件(响应),给我想要的货(网页资源)
我一遍排货(浏览器渲染、构建网页)一遍根据清单按顺序去多次请求多点货过来(继续请求资源)
断开连接--四次挥手
客户端与服务器的相互通信完成后，便会断开连接，断开连接主要有四个步骤，一般称为客户端与服务器端的四次挥手：
浏览器向服务器发送想断开连接的请求
服务器向浏览器发送收到请求的响应
服务器向浏览器发送断开连接的请求
浏览器断开连接并向服务器发送一个反馈请求，服务器收到后断开连接
1.我发现清单上的东西我要求完了,这时我发邮件(请求)说,就之前我说的那些,多的我不要了,搞完就解散生意伙伴关系吧~(断开连接)
2.马云说回信(响应)说好的,你的意思我收到了(已收到断开连接请求)
3.马云把之前的货物(网页资源数据处理好)还没有发送过的数据发送之后,就向我说准备解散生意伙伴关系(发出断开请求)
4.我解散生意伙伴关系(断开连接)并反馈回去,马云收到后也中止(断开连接)) ,因为我和他都绝交了,不用通知了,都没联系了~
为什么客户端与服务器断开连接是四次挥手呢？
主要是因为当客户端告诉服务器想断开连接的时候，服务器的数据不一定已处理完毕，
以服务器是先告诉客户端说已经收到了它想断开连接的请求，然后当服务器中数据处理完毕时，
便通知客户端并请求断开连接，客户端收到后便断开连接并通知服务器，服务器收到后才断开连接
了解到拿到资源的过程,那么怎么在浏览器渲染,呈现网页呢？ 可以看看我这篇:浏览器渲染以及重绘(repaint)和回流(reflow)
