浏览器输入url会发生什么

rainbowdiary
1,210 阅读15分钟

浏览器输入url后，浏览器向DNS服务器发送请求，将域名解析为ip地址

DNS域名解析

在搭建一个web服务的时候是先有服务器，每台服务器只有唯一的ip地址，在服务器上搭建对应的应用，一个web应用（比如nginx服务）可以直接使用外网ip地址加端口直接访问，如果你的网站只有内网ip地址，没有外网ip地址是无法访问的。但是为了方便用户访问，所以给ip地址绑定了一个域名，域名是需要购买的，每年都需要续费。

截屏2021-10-30 下午3.41.53.png

dns就是domain name system：就是域名系统，就是域名和ip地址映射关系的系统。

DNS解析的过程： 就像是找书，先问身边的朋友有没有书，再去图书馆找书，找到大类在哪里，跑到大类那里找到中类-跑到中类去找到小类在哪里-跑到小类那里找到书在哪个地方-跑到书的地方找到书

比如访问www.baidu.com， 则是 www.baidu.com. 

域名从右到左：

  • 根域名. 

  • 顶级域名又称一级域名(.com)

  • 二级域名(baidu.com) 

  • 三级域名(www.baidu.com, www为主机名称，www/mail/member/space，www.baidu.com一般是主站，member.baidu.com会员网站，mail.baidu.com邮箱网站)

  • 根域名管理.com/.cn/.net域名，顶级域名服务器会分别管理各自的域名服务器比如bilibili和qq为权威域名服务器

dns域名解析的过程：

  • 在url输入www.bilibili.com 就像去图书馆找书，浏览器会先自己的缓存中查找有没有对应的ip记录，同时查询主机本地hosts文件是否有对应记录，如果有则没必要再找了。假设没有缓存

  • 浏览器为了解析域名会调用解析器进行解析，解析器就像DNS客户端，需要像DNS服务器查询ip地址，解析器就会向DNS服务器发送请求，我们电脑的网络设置中就有本地DNS服务器（一般是中国电信）的地址的。如果没有dns服务器地址，或者dns地址设置错误，但是可以上网，会出现可以上qq，但是不能浏览网页，因为qq是通过ip地址访问服务器的。  

  • 接来下的步骤就由本地DNS服务器独立完成，解析器只需要等待结果就行。
    • 客户端与本地dns服务器就是递归的方式查询，客户端只需要发送请求给本地dns服务器，等待本地dns服务器将结果返回给客户端即可。
  • 本地dns服务器查询ip地址的过程为迭代的方式查询：
    • 可以用命令行模拟本地dns服务器查询的过程
    • nslookup set type=ns设置查询的类型为ns，也就是名称服务器
    • 本地dns服务器如果没有缓存ip地址
    • 询问根域名，获取顶级域名 .com 的 NS(Name Server) 和 A(Address)，NS为顶级域名的名字，A即NS对应的ip地址
    • 询问顶级域名，获取二级域名 .tencnet.com 的NS 和 A
    • 询问二级域名，获取三级域名 .cloud.tencent.com 的NS 和 A
~ % nslookup
> set type=ns
> .     //查询根服务器的域名
Server:		114.114.114.114
Address:	114.114.114.114#53  //根服务器53端口

Non-authoritative answer:  //缓存的结果，以下为根服务器的域名
.	nameserver = f.root-servers.net.
.	nameserver = e.root-servers.net.
.	nameserver = g.root-servers.net.
.	nameserver = k.root-servers.net.
.	nameserver = a.root-servers.net.
.	nameserver = h.root-servers.net.
.	nameserver = b.root-servers.net.
.	nameserver = m.root-servers.net.
.	nameserver = j.root-servers.net.
.	nameserver = c.root-servers.net.
.	nameserver = i.root-servers.net.
.	nameserver = l.root-servers.net.
.	nameserver = d.root-servers.net.

Authoritative answers can be found from:  //服务器发送请求得到的结果
>

> set type=a //查询
> f.root-servers.net.
Server:		114.114.114.114
Address:	114.114.114.114#53

Non-authoritative answer:
Name:	f.root-servers.net
Address: 192.5.5.241
> server 192.5.5.241 //设置为根服务器
Default server: 192.5.5.241
Address: 192.5.5.241#53 
> set type=ns
> com.  //向根服务器询问com域名服务器的地址
;; Truncated, retrying in TCP mode.
Server:		192.5.5.241
Address:	192.5.5.241#53

Non-authoritative answer:
*** Can't find com.: No answer

Authoritative answers can be found from: //以下全部都是根服务器返回给本地服务器的com服务器的域名
com	nameserver = l.gtld-servers.net.
com	nameserver = b.gtld-servers.net.
com	nameserver = c.gtld-servers.net.
com	nameserver = d.gtld-servers.net.
com	nameserver = e.gtld-servers.net.
com	nameserver = f.gtld-servers.net.
com	nameserver = g.gtld-servers.net.
com	nameserver = a.gtld-servers.net.
com	nameserver = h.gtld-servers.net.
com	nameserver = i.gtld-servers.net.
com	nameserver = j.gtld-servers.net.
com	nameserver = k.gtld-servers.net.
com	nameserver = m.gtld-servers.net.
l.gtld-servers.net	internet address = 192.41.162.30  //gtld：generic top level domain通用顶级域名，顶级域名tld中最常见的一种。
l.gtld-servers.net	has AAAA address 2001:500:d937::30 //域名和域名对应的ipv6地址
b.gtld-servers.net	internet address = 192.33.14.30 //域名和域名对应的ipv4地址
b.gtld-servers.net	has AAAA address 2001:503:231d::2:30
c.gtld-servers.net	internet address = 192.26.92.30
c.gtld-servers.net	has AAAA address 2001:503:83eb::30
d.gtld-servers.net	internet address = 192.31.80.30
d.gtld-servers.net	has AAAA address 2001:500:856e::30
e.gtld-servers.net	internet address = 192.12.94.30
e.gtld-servers.net	has AAAA address 2001:502:1ca1::30
f.gtld-servers.net	internet address = 192.35.51.30
f.gtld-servers.net	has AAAA address 2001:503:d414::30
g.gtld-servers.net	internet address = 192.42.93.30
g.gtld-servers.net	has AAAA address 2001:503:eea3::30
a.gtld-servers.net	internet address = 192.5.6.30
a.gtld-servers.net	has AAAA address 2001:503:a83e::2:30
h.gtld-servers.net	internet address = 192.54.112.30
h.gtld-servers.net	has AAAA address 2001:502:8cc::30
i.gtld-servers.net	internet address = 192.43.172.30
i.gtld-servers.net	has AAAA address 2001:503:39c1::30
j.gtld-servers.net	internet address = 192.48.79.30
j.gtld-servers.net	has AAAA address 2001:502:7094::30
k.gtld-servers.net	internet address = 192.52.178.30
k.gtld-servers.net	has AAAA address 2001:503:d2d::30
m.gtld-servers.net	internet address = 192.55.83.30
m.gtld-servers.net	has AAAA address 2001:501:b1f9::30

> server 192.41.162.30  //设置服务器为com的服务器
Default server: 192.41.162.30
Address: 192.41.162.30#53
> set type=ns
> bilibili.com.   //向com服务器请求bilibili.com的ns
Server:		192.41.162.30
Address:	192.41.162.30#53

Non-authoritative answer:
*** Can't find bilibili.com: No answer

Authoritative answers can be found from:
bilibili.com	nameserver = ns3.dnsv5.com.   //bilibili的两个域名服务器，权威域名服务器
bilibili.com	nameserver = ns4.dnsv5.com.
ns3.dnsv5.com	internet address = 129.211.176.212
ns3.dnsv5.com	internet address = 162.14.18.188
ns3.dnsv5.com	internet address = 162.14.24.251
ns3.dnsv5.com	internet address = 162.14.25.251
ns3.dnsv5.com	internet address = 18.194.2.137
ns3.dnsv5.com	internet address = 183.192.201.94
ns3.dnsv5.com	internet address = 223.166.151.16
ns3.dnsv5.com	has AAAA address 2402:4e00:1430:1102:0:9136:2b2b:ba61
ns3.dnsv5.com	internet address = 52.77.238.92
ns3.dnsv5.com	internet address = 61.151.180.51
ns4.dnsv5.com	internet address = 101.226.220.12
ns4.dnsv5.com	internet address = 129.211.176.151
ns4.dnsv5.com	internet address = 162.14.24.248
ns4.dnsv5.com	internet address = 162.14.25.248
ns4.dnsv5.com	internet address = 183.192.164.119
ns4.dnsv5.com	internet address = 223.166.151.126
ns4.dnsv5.com	has AAAA address 2402:4e00:1020:1264:0:9136:29b6:fc32
ns4.dnsv5.com	internet address = 52.198.159.146
ns4.dnsv5.com	internet address = 59.36.120.147

> server 129.211.176.212 
Default server: 129.211.176.212
Address: 129.211.176.212#53
> set type=a
> www.bilibili.com. //向权威域名服务器请求www.bilibili.com.的ipv4的地址
Server:		129.211.176.212
Address:	129.211.176.212#53

www.bilibili.com	canonical name = a.w.bilicdn1.com.  //cname记录

> a.w.bilicdn1.com. //拿到cdn内容分发地址的ipv4地址
Server:		129.211.176.212
Address:	129.211.176.212#53

a.w.bilicdn1.com	canonical name = s.w.bilicdn1.com.  //本地dns服务器拿到这些地址返回给解析器，并且缓存这些地址 ，解析器接着把地址给浏览器。浏览器就可以用ip地址连接服务器了
Name:	s.w.bilicdn1.com
Address: 119.3.65.164
Name:	s.w.bilicdn1.com
Address: 119.3.77.172
Name:	s.w.bilicdn1.com
Address: 120.92.218.109
Name:	s.w.bilicdn1.com
Address: 120.92.168.51

以下是m.taobao.com DNS解析结果

> set type=ns

> m.taobao.com

Server: 2408:840c:de5f:e936::1c

Address: 2408:840c:de5f:e936::1c#53


Non-authoritative answer:

m.taobao.com canonical name = h5.m.taobao.com.danuoyi.tbcache.com.


Authoritative answers can be found from:

danuoyi.tbcache.com

origin = danuoyins7.tbcache.com

mail addr = root.taobao.com

serial = 2012031100

refresh = 3600

retry = 3600

expire = 604800

minimum = 300

> set type=a

> m.taobao.com

Server: 2408:840c:de5f:e936::1c

Address: 2408:840c:de5f:e936::1c#53

Non-authoritative answer:

m.taobao.com canonical name = h5.m.taobao.com.danuoyi.tbcache.com. //最终返回给LDNS的是这个CNAME记录对应的ip地址

Name: h5.m.taobao.com.danuoyi.tbcache.com

Address: 27.221.120.54

Name: h5.m.taobao.com.danuoyi.tbcache.com

Address: 27.221.120.53

>

dig命令可以直接查看到域名对应的包括NS记录，A记录，MX记录等相关信息

dig m.taobao.com

; <<>> DiG 9.10.6 <<>> m.taobao.com

;; global options: +cmd

;; Got answer:
;; ->>HEADER<<- opcode: QUERY, status: NOERROR, id: 43746
;; flags: qr rd ra; QUERY: 1, ANSWER: 3, AUTHORITY: 0, ADDITIONAL: 1
;; OPT PSEUDOSECTION:
; EDNS: version: 0, flags:; udp: 512

;; QUESTION SECTION:
;m.taobao.com. IN A
;; ANSWER SECTION:

m.taobao.com. 153 IN CNAME h5.m.taobao.com.danuoyi.tbcache.com.
h5.m.taobao.com.danuoyi.tbcache.com. 60 IN A 27.221.120.54
h5.m.taobao.com.danuoyi.tbcache.com. 60 IN A 27.221.120.53


;; Query time: 61 msec
;; SERVER: 2408:840c:de5f:e936::1c#53(2408:840c:de5f:e936::1c)
;; WHEN: Sun Oct 31 17:15:58 CST 2021
;; MSG SIZE  rcvd: 119

更加详细的解析过程dig m.taobao.com +trace

rainbow@MacBook ~ % dig m.taobao.com +trace

; <<>> DiG 9.10.6 <<>> m.taobao.com +trace

;; global options: +cmd

. 463166 IN NS k.root-servers.net.

. 463166 IN NS c.root-servers.net.

. 463166 IN NS l.root-servers.net.

. 463166 IN NS i.root-servers.net.

. 463166 IN NS e.root-servers.net.

. 463166 IN NS g.root-servers.net.

. 463166 IN NS j.root-servers.net.

. 463166 IN NS m.root-servers.net.

. 463166 IN NS a.root-servers.net.

. 463166 IN NS f.root-servers.net.

. 463166 IN NS d.root-servers.net.

. 463166 IN NS h.root-servers.net.

. 463166 IN NS b.root-servers.net.

;; Received 239 bytes from 2408:840c:de5f:e936::1c#53(2408:840c:de5f:e936::1c) in 46 ms

com. 172800 IN NS l.gtld-servers.net.

com. 172800 IN NS b.gtld-servers.net.

com. 172800 IN NS c.gtld-servers.net.

com. 172800 IN NS d.gtld-servers.net.

com. 172800 IN NS e.gtld-servers.net.

com. 172800 IN NS f.gtld-servers.net.

com. 172800 IN NS g.gtld-servers.net.

com. 172800 IN NS a.gtld-servers.net.

com. 172800 IN NS h.gtld-servers.net.

com. 172800 IN NS i.gtld-servers.net.

com. 172800 IN NS j.gtld-servers.net.

com. 172800 IN NS k.gtld-servers.net.

com. 172800 IN NS m.gtld-servers.net.

com. 86400 IN DS 30909 8 2 E2D3C916F6DEEAC73294E8268FB5885044A833FC5459588F4A9184CF C41A5766

com. 86400 IN RRSIG DS 8 1 86400 20211113050000 20211031040000 14748 . UvOiNcstOVmquPVckZTy9fhSKPEyXjQQmCv6btBlzTyks507IcApk6jo 37/jCx3RkRrtLuQefqicdyY9T8TI4d6nPOIVzTAAES8M667GArQwLM2o Cg8hPTf5Uu7H8E4kRY6FW99slddZs6fq/tJmGnfzyrOfNjt9wsPq/n3O PGwqwF20yYthlTzO7kcZCARb9wECcpys4wblRAhqTnS2CIFcWuu6xE3i sp/8b1y6t9BdKBX9DAwQF1yadSECCa+smOrajkqkER+yysqWJ73ZI0mB CYm38GRKYzlmuWsjhK40pSceNrTThMurCgFz2f6y3sJQUEfW4ws5r4/D 85hYmg==

;; Received 1172 bytes from 192.203.230.10#53(e.root-servers.net) in 354 ms


taobao.com. 172800 IN NS ns4.taobao.com.

taobao.com. 172800 IN NS ns5.taobao.com.

taobao.com. 172800 IN NS ns6.taobao.com.

taobao.com. 172800 IN NS ns7.taobao.com.

CK0POJMG874LJREF7EFN8430QVIT8BSM.com. 86400 IN NSEC3 1 1 0 - CK0Q1GIN43N1ARRC9OSM6QPQR81H5M9A  NS SOA RRSIG DNSKEY NSEC3PARAM

CK0POJMG874LJREF7EFN8430QVIT8BSM.com. 86400 IN RRSIG NSEC3 8 2 86400 20211104042339 20211028031339 15549 com. ZJG+SDuthSXu/Q4z/NJoVFI8s0WLyUrnMSuA9oSSuyPKoCyylh0XaPLh gLjdYQogtptxU+2heFWaLP+WSxfr+LzKpoTiuiG1cDl3BS1l0hbNBktm JC2WplzT7Mxg/3Z5l12g+2uN1/Qpp9Og2sZ66B4Th9nuSFXNmzshDOYT E8sjVT6x650u9mKVLfhOY4CqPhJeoMEvnPq/krqT4cQ3Cw==

D9N2ANM7BT92D9HP8CETPLBM45COQFF8.com. 86400 IN NSEC3 1 1 0 - D9N3BRU90NI6RBGKREJNQNC0EO65R34E  NS DS RRSIG

D9N2ANM7BT92D9HP8CETPLBM45COQFF8.com. 86400 IN RRSIG NSEC3 8 2 86400 20211104045219 20211028034219 15549 com. ArrPhDpmno6ade/a+9Ocp1jiZmdxwdjtj5g6cSTGBsCGiNlsAalIsio+ EyGvaq56eIxCXLKfIVWPQUTHdp5kgA6J/nacf0UPCksJch1p1s/DDodE z4e14+dtL9cNIc/3nyideha08vDZTeejgzGz3FdD0tDd6t+lYumuvRMI 9QoGvz54fWLAiaSI4ezETR0WNHIlq6a668tOZb+ZuekxqQ==

;; Received 902 bytes from 192.31.80.30#53(d.gtld-servers.net) in 293 ms


m.taobao.com. 600 IN CNAME h5.m.taobao.com.danuoyi.tbcache.com.

;; Received 90 bytes from 198.11.138.245#53(ns4.taobao.com) in 222 ms

还可以进一步查看到域名的注册情况： 截屏2021-10-31 下午5.59.18.png

bilibli.com的域名猜测也是通过Alibaba Cloud购买的，淘宝网成立于2003年，但是在2000年左右(还查到了一个2000年该机构购买的域名)开始就在大量购买域名了。 image.png

CDN内容分发

参考：阿里云CDN服务

CDN是建立并覆盖在承载网上，由不同区域的服务器组成的分布式网络。将源站的资源缓存到全部各个边缘节点上，供用户就近获取，降低源站的压力，加速网站内容的分发，提供资源访问的速度。

image.png

通过上面DNS域名解析，解析到www.baidu.com 的域名和地址，会发现返回回来的是a.w.bilicdn1.com 一般大型网站，因为客户访问量比较大， 对网站访问速度要求比较高，都会使用CDN网站进行内容的分发。

假设你只有一台服务器，是北京地区的服务器，上海的人要跟你建立连接就只能访问到北京的服务器，但是如果你还有一台上海的服务器，不需要经过多个节点，你就可以就近从上海的服务器上获取资源，避免了网络的延时，并且能够快速的提供服务。

CDN还有缓存的功能，如果需要访问1.jpg, 你的请求会打到最近的CDN服务器上，最近的CDN服务器会看自己是否有1.jpb的缓存，如果有就直接返回给你，如果没有才会向源站发请求。

  • CDN也会出现问题，遇到发布后图片更改，但是图片名称还是1.jpg，虽然内容改了，但是网页内容仍然没有改动，这样就需要手动刷新CDN缓存。或者图片名称带上hash值刷新缓存

这个跟webpack每次打包后，都会生成不用hash对应的文件名称清除缓存的道理是一样的。

DNS和CDN结合的过程

  • 浏览器客户端输入url，进行DNS域名解析，看本地hosts文件和缓存中是否有，有则直接返回给浏览器客户端，没有则发送请求给本地域名解析服务器寻找 www.bilibili.com的ip地址
  • LDNS去.根服务器寻找com的域名地址，返回给LDNS
  • LDNS再发送请求给com的域名服务器寻找bilibi.com的ip地址，com返回对应CNAME的授权的CDN对应的ip地址
  • 授权的CDN会根据自己的调度系统，返回最近CDN节点的ip地址。
  • LCDN拿到最近CDN节点的ip地址返回给浏览器客户端
  • 浏览器客户端跟最近CDN节点进行连接和通信，请求资源

TCP连接

互联网中的数据是通过数据包传输的，网络中传输的数据包容易丢失和出错，TCP连接就是为了确保数据传输的可靠和完整性。 Transimission Control Protocol（传输控制协议）是一种面向连接的，可靠的，基于字节流的的传输层协议

核心： 重传机制和数据包排序：TCP的头包含源端口号，目标端口号，还提供了用于排序的序列号，以便接收端通过序列号把乱序的数据包重排。如果只传输单个数据包，TCP和UDP的流程差不多，不同的地方在于TCP头部信息保证了一大块数据传输的完整性。TCP连接的过程就是为了保证重传机制和数据包排序的功能。

一个TCP的生命周期

  • 建立连接：三次握手，客户端和服务器总共发送三个数据包建立连接
  • 数据传输：接收端对数据包进行确认，如果接收端没有确认则判断为数据包丢失发送端触发重发机制。
  • 断开连接：四次挥手

一个TCP请求包含了： image.png

  • 确认标志位
  • 协商双方的序列号，用于给数据包排序 传输的内容：三次握手

  1. 第一次连接，C向S发送TCP报文，发送SYN=1，seq=100(假设)发送C的序列号给S，告诉S我想请求数据

  2. 第二次连接，S向C发送TCP报文，发送标志位SYN=1，ACK=1，ack=100+1，seq=200，发送标志位和自己的序列号，告诉C你的请求已经完全收到，可以我也可以给你提供服务，但是此时S并不知道自己发送的报文C是否收到

  3. 第三次连接，C向S发送报文ACK=1，ack=200+1，告诉服务端我收到了你发送的信息，我已经知道你接受和发送正常，知道了你发送和接受正常，我们开始建立连接把。

    • seq是随机的，因为可能有多个C向S发送请求，S需要确认C1的消息是C1发送的
    • 序列号使用随机的32位，是为了减少传输数据冲突的概率
    • S也需要像C发送自己的序列号是为了更加方便告诉C，你发送的100个数据我都收到了，下次你直接从101的数据开始发送吧

四次挥手

  1. 第一次挥手，C发送TCP报文标志位FIN=1，seq=300，告诉S我想跟你断开连接
  2. 第二次挥手，S发送TCP报文标志位ACK=1，确认位ack=300+1,告诉C我已经收到了你的申请，但是我还没准备好
  3. 第三次挥手，S发送TCP报文FIN=1,seq=500，发送自己的序列号，告诉C我数据已经发送完毕，我们可以断开连接
  4. 第四次挥手，C发送TCP报文，标志文ACK=1，ack=500+1，告诉S我知道你已经准备好了，我也已经准备好了，我们断开连接吧

image.png

最好理解的方式

  • 起一个客户端(172.12.0.1)
  • 再起一个服务器(172.12.0.2)
  • 模拟发送请求 172.12.0.1>172.12.0.2
  • 使用tcpdump命令可以很明显的看出客户端和服务器之间的三次握手，和发送的seq序列号，ack确认号

TLS连接

HTTP请求

  • 缓存
    • 为什么第一次打开一个网页很慢，第二次秒开？
  • 登陆态
    • 浏览器如何保持登陆态

HTTP协议作为浏览器使用在应用层的协议，是建立在TCP连接之上的。HTTP请求是在TCP数据传输阶段。

http和https的区别

浏览器客户端建立TCP连接后，会发送HTTP或者HTTPS请求，一般请求回来的是HTML文件。

现在大部分数据传输都是通过HTTPS协议进行传输，所以在TCP三次握手后建立连接后还需要进行TLS连接，进行加密传输，保证数据传输的安全性。

截屏2021-10-31 下午3.24.10.png

截屏2021-10-31 下午3.25.56.png

  1. 安全性上
    • HTTP是明文传输数据，数据都是未加密的
    • HTTPS是SSL+HTTP，数据是加密传输的
  2. 配置上的区别
    • HTTPS需要到CA机构去申请一个证书，然后生成证书的公钥和私钥，传输的时候S将公钥发送给C，C根据S的公钥生成随机值，S收到了C发送的随机值，只有S才能够解密这个随机值，这样保证了数据的安全性。
    • HTTP启动web服务器应用层默认就是使用HTTP数据传输的
  3. 响应速度
    • HTTP页面响应速度比HTTPS快
    • HTTP数据连接的时候，客户端和服务器交换三个包，但是HTTPS除了TCP的三个包，还要加上SSL握手所需的9个包，一共12个包
    • 应用层和传输层多了一个安全层就是SSL协议
  4. 端口不一样
    • 80、443

浏览器进行页面的渲染

浏览器的渲染

浏览器缓存机制

页面渲染优化

avatar
文章
阅读
粉丝