你在浏览器输入了baidu.com 并按下回车后，背后到底发生了什么？

2019-06-28

有些找过工作面试的朋友（特别是爬虫的岗位）应该常常被问到，你知道你在浏览器输入百度的网址之后，背后做了什么操作吗？其实这主要是想看看你对计算机网络协议的了解，今天小帅b就跟你浅谈一下这个问题，在此之前，我们先来了解一下什么是 URL 。

你真的理解URL是什么？

我们经常使用浏览器上网，在想要查询某些网站的时候，我们都会在浏览器的地址栏中输入一段字符串，也就是我们常说的「网址」，其实我们说的这个「网址」，指的就是URL，URL的全称是Uniform Resource Location，叫做「统一资源定位」。

比如我们想要访问 google，应该会在浏览器的地址栏中输入：

http://www.google.com。

这时候我们可以看到 URL 中两个比较重要的部分，一个是协议，一个是资源名称，它们被「://」分隔开，左边的 http 就是协议，右边的 www.google.com 就是资源名称。

我们这里用到的协议是 HTTP 协议，他的全称叫做超文本传输协议，网络上的请求协议有许多，例如我们比较熟悉的其它协议有 ftp 协议，https 协议等等。

为什么要用协议呢？

因为没有规矩，不成方圆，我们在传输数据的时候，需要通过相应的规则才能获取相应的资源，比如你在家里，突然饿了，想要点外卖，那么你需要找到你想吃的，然后付钱，商家才给你做，外卖小哥哥才笑嘻嘻的给你送，如果你不遵循这一规则，你不给钱，你能吃到吗？外卖小哥会笑嘻嘻给你送吗？除非很帅。

所以我们这里使用的 HTTP 协议，可以给我们提供超文本文档。

资源名称

资源名称是一个完整的地址，它的格式是完全取决于协议而定，不过在大多数的协议里面，资源名称都包括：

1.Host Name ：主机名，也就是服务器的名称，一般是域名，也就是域名对应的这台服务器的 ip 地址，例如http://www.google.com 中的 www.google.com 就是主机名。

2.FileName ：文件名，也就是我们要访问服务器上某个位置上的文件，这个文件所在的路径名就是FileName，例如我们要访问 a 服务器上的老师目录下的照片，那么我们就可以这样访问：

http://www.a.com/teacher/照片.jpg

这里的 teacher/照片.jpg 就是FileName。

3.Port Number: 端口号，这个是用于连接的端口，我们默认访问不需要输入端口，是因为 80 是默认的连接端口，一般服务器上有 0-65535 个端口，他开放哪个端口给你访问，你就只能通过它给你的端口进行访问，就好比你要去开房，发现酒店有65536 个房间，然后客服人员告诉你第 8000 个房间可以住，那么你就交完钱拿着房卡去 8000 号的房玩耍，总不会去 65536 个房间玩个遍吧！

这个端口后一般是在尾部添加冒号，在冒号写上端口号。例如：http://www.google.com:80

4.Parameters :请求参数，我们可以通过参数去访问特定的资源，一般在访问的地址后面添加 key-value 的相识的值去访问，例如我们要访问 a 这个网站的老师目录下第一到第十张波多野结衣的照片就可以这样呀访问：

http://www.a.com/teacher/pic/boduoyejieyi?start=1&end=10

好了，接下来就说说你在浏览器输入baidu.com后，都发生了什么

你在 Chrome 的地址栏输入baidu.com

2.Chrome通过 DNS 去查找 baidu.com 这个域名对应的IP地址：

DNS的查找过程是这样的：

Chrome浏览器会先查找有没有缓存的 DNS 记录，如果在浏览器缓存没有找到需要的记录，就会去做一个系统的调用，获取系统缓存的记录；

如果没有记录请求会继续到路由器上，路由器上有自己的 DNS 缓存；

如果没有记录就会到 ISP 的 DNS 缓存中查看记录；

如果没有记录就会在 ISP 的 DNS 服务器从根服务器域名服务器开始递归搜索最后得到 IP 地址。

3.浏览器给 baidu 服务器发送一个 HTTP 请求

获取到 baidu 的 ip 地址之后，就可以给 baidu 这个服务器发送 HTTP 请求了，我们通过 URL 地址去发送的时候是一个GET 的请求，这时候会向 baidu 服务器发送一个 header 信息：

Accept:text/html,Application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8
Accept-Encoding:gzip, deflate, br
Accept-Language:zh-CN,zh;q=0.8
Cache-Control:no-cache
Connection:keep-alive
Cookie:PSTM=1506157985; BIDUPSID=DA662DF344C147D17FB4828CCD795292; ...
Host:www.baidu.com
Pragma:no-cache
Upgrade-Insecure-Requests:1
User-Agent:Mozilla/5.0 (windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/61.0.3163.100 Safari/537.36

经常写反反爬的话你应该知道其中

User-Agent是向 baidu 服务器提供浏览器的类型，操作系统版本，浏览插件，浏览器语言等信息。
Accept是告诉服务器说我们需要接收的类型是什么样子的。
Connection:keep-alive 是为了后边请求不要关闭TCP连接。
Cookie 是以文本形式存储，每次请求的时候就会发送给服务器，它可以存储用户的状态，用户名等信息。

4.baidu服务器301重定向响应

因为刚刚我们在 Chrome 浏览器中输入的是 baidu.com 而不是www.baidu.com，这时候 baidu 服务器就会将我们的请求响应一个 301 永久重定向到 www.baidu.com。

5.Chrome浏览器请求重定向来的地址

这时候 Chrome 浏览器知道 www.baidu.com 才是 baidu 希望访问的地址，那么这时候 Chrome 浏览器就会给 baidu 服务器发送另一个请求。

6.baidu服务器处理请求

baidu服务器在这个时候接收到了请求，它会去查看请求它的参数还有 cookie 信息，然后会进行一些操作处理，例如对数据进行存储，从数据库中获取需要被请求的数据等。

7.baidu服务器返回HTML响应

当 baidu 服务器处理好之后，就会给浏览器返回数据了，这个时候会有一个 Response Headers 发送给浏览器：

Bdpagetype:1
Bdqid:0xddf2be49000b5995
Bduserid:0
Cache-Control:private
Connection:Keep-Alive
Content-Encoding:gzip
Content-Type:text/html; charset=utf-8
Cxy_all:baidu+09720a4fa84e5493ae7506a57de6bc05
Date:Sat, 14 Oct 2017 09:39:32 GMT
Expires:Sat, 14 Oct 2017 09:39:32 GMT
Server:BWS/1.1
Set-Cookie:BDSVRTM=49; path=/
Set-Cookie:BD_HOME=0; path=/
Set-Cookie:H_PS_PSSID=1440_13551_21103_24658; path=/; domain=.baidu.com
Strict-Transport-Security:max-age=172800
Transfer-Encoding:chunked
Vary:Accept-Encoding
X-Powered-By:Hphp
X-Ua-Compatible:IE=Edge,chrome=1

Response Headers 说明了是否缓存这个页面，怎么去解释响应信息，cookie 的设置，隐私信息等。

其中

Content-Encoding:gzip告诉浏览器整个响应体是用gzip算法压缩的。
Content-Type:text/html; charset=utf-8 告诉浏览器将响应的内容以HTML的形式呈现出来，字符集是utf-8。

8.Chrome浏览器显示baidu页面

这时候 Chrome 浏览器获得了响应内容，就开始显示 baidu 的HTML页面了，浏览器在显示的时候，发现需要获取其他的标签内容，比如图片、css 样式表、JAVAScript 文件，那么浏览器就会继续对 baidu 服务器去发送请求这些内容，这些静态的文件baidu 会把它进行缓存，利用内容分发网络（CDN）进行分发，所以这些静态文件在很多 CDN 数据中心都有备份，所以浏览器很快就能获取到这些静态文件。

从而进行页面吧的完整的显示:

当然，这只是浅谈一下，让你有一个清晰的了解，如果你对网络方面感兴趣的话，可以去了解一下计算机网络的组成，什么是报文，什么是分组交换，如何握手以及各层之间的关系，比如物理层，数据链路层，运输层等。