跳到主要内容

计算机网络面试题

http1.1 /2.0/3.0 区别

幂等和副作用

  • 副作用是指对服务器上的资源做改变,搜索是无副作用的,注册是有副作用的。
  • 幂等是指对服务器发送 1 到 N 次请求,服务器上的资源一致,如搜索关键词。

HTTP 版本

  1. HTTP 1.0 (1996 年 5 月)
  • 除了 GET 命令,还引入 POST 命令和 HEAD 命令
  • 可以传输任何格式内容,包括文字、图片、视频、二进制。
  • 因为 http 是无连接和无状态的,存在无法复用链接队头阻塞问题。
    1. HTTP 1.1 (1997 年 1 月)
  • 默认开启 keep Alive(1.0 就有,但是 1.1 默认开启),也就是持久连接(persistent connection)
  • 引入了管道机制( pipelining),即在同一个 TCP 连接里,客户端可以同时发送多个请求
  • 增加缓存处理(新的字段如 cache-control,强缓存和协商缓存)
  • 增加 Host 字段(使得一个服务器能够用来创建多个 Web 站点)、支持断点传输等
  • http 协议不带有状态,每次请求都必须附上所有信息。请求的很多字段都是重复的,浪费带宽,影响速度)
  • 1.1 版本允许复用 TCP 连接,但是同一个 TCP 连接里面,所有的数据通信是按次序进行的。服务器只有处理完一个回应,才会进行下一个回应,可能会造成 Head-of-line blocking(队头阻塞)的问题
  1. HTTP 2.0 (2015 年 5 月)
  • http/2 是一个彻底的二进制协议,头信息和数据体都是二进制,并且统称为"帧"(frame):头信息帧和数据帧。(封装成帧)
  • HTTP/2 允许服务器未经请求,主动向客户端发送资源,即服务器推送。(服务器推送)
  • 引入头信息压缩机制( header compression) ,头信息使用 gzip 或 compress 压缩后再发送。(头部压缩)
  • HTTP 1.x 并没有真正意义上的解决连接复用问题,连接共享意味着客户端与服务器之间也只需要一个连接即可,这样即使来自很多流的数据包也能够混合在一起通过同样连接传输,再根据不同帧首部的 stream id 标识符重新连接将不同的数据流进行组装(多路复用/链接共享)
    1. HTTP 3.0
  • HTTP3.0 不使用 TCP 协议,而是使用全新的 QUIC 协议(也就是 UDP),这个协议能让你通过 UDP 创建一系列带状态的流,解决 TCP 队头阻塞问题。

为什么说 http 是无状态的,怎么解决呢?

无状态服务器处理完成后立即断开 TCP 连接(无连接),服务器不跟踪每个客户端也不记录过去的请求(无状态),服务器不会在两个请求之间保留任何数据(状态),比如比如在一个电商网站里,用户把某个商品加入到购物车,切换一个页面后再次添加了商品,这两次添加商品的请求之间没有关联,浏览器无法知道用户最终选择了哪些商品。 tip 可以借助 cookie 来保存状态

https 握手和加密过程,为什么 https 就能安全?

非对称加密,对称加密,数字证书 CA

  • http 是明文传输的,无法验证报文的完整性,无法验证双方的身份
  • HTTPS 是基于 HTTP 协议的,会使用 TLS/SSL 来对数据加密,所有的信息都是加密的,并且它提供了一种校验机制,信息一旦被篡改,通信的双方会立刻发现,它还配备了数字身份证书 CA,防止身份被冒充的情况出现,第三方没有办法窃听
  • TCP 三次握手后开始进行 TLS 握手
    • TLS 第一次握手,客户端向服务器发起请求,请求中包含使用的协议版本号、生成的一个随机数,以及客户端支持的加密方法
    • 第二次,服务器端接收到请求后,确认双方使用的加密方法、并给出服务器的证书、以及一个服务器生成的随机数
    • 第三步,客户端确认服务器证书有效后,生成一个新的随机数,并使用数字证书中的公钥,加密这个随机数,如果服务端需要验证客户端证书的话会附带证书然后发给服务器。并且还会提供一个前面所有内容的 hash 的值,用来供服务器检验。
    • 第四步,服务器收到加密过的随机值使用自己的私钥,来解密客户端发送过来的随机数获得第三个随机数。并提供前面所有内容的 hash 值来供客户端检验。
    • 第五步,这时候两端都拥有了三个随机值,可以通过这三个随机值按照之前约定的加密⽅式⽣成密钥,接下来的通信就可以通过该密钥来加密解密.客户端和服务器端根据约定的加密方法使用前面的三个随机数,生成对话秘钥,以后的对话过程都使用这个秘钥来加密信息。

https 服务器给客户端发送证书过程中给黑客篡改了怎么办?

浏览器内置了各大 CA 机构的公钥信息,如果证书被篡改,浏览器就提示不可信,终止通信。因为证书中包含数字签名,用于作防伪标识。

TCP 和 UDP 区别?

  • TCP 是面向链接的,需要经过三次握手才能建立链接,而 UDP 是无连接的,不需要握手。
  • TCP 是可靠的,UDP 不可靠。TCP 有拥塞控制,流量控制等一系列保证接受的报文是完整的,在网络差的情况下会限制速率,而 UDP 没有, UDP 报文段的发送速率没有限制。
  • UDP 可以支持一对一、一对多、多对一和多对多的交互通信。TCP 全双工
  • 高性能用 UDP,高稳定用 TCP。如视频会话,游戏等对延迟敏感的用 UDP,对数据完整性如
  • TCP 首部 20 个字节,UDP8 个。

TCP 三次握手和四次挥手,为什么要三次和四次?多了或少了怎么样?

三次是防止旧的重复连接引起连接混乱问题

三次握手的原因

  • 三次握手证明双方的通信都是能互相到达的,即时是过时的链接,也能正常过程
  • 两次握手不能证明客户端能接受到服务端的消息,只能证明客户端能接受到服务端的消息
    • 若客户端的连接请求超时,并且放弃了连接,服务器应答但客户端已经放弃连接,白白浪费服务器资源。

      为什么不四次握手?

  • 三次握手就能解决为什么要四次握手? 节省资源~

GET 和 POST 区别?

Post 和 Get 是 HTTP 请求的两种方法。

(1)从应用场景上来说,GET 请求是一个幂等的请求,一般 Get 请求用于对服务器资源不会产生影响的场景,比如说请求一个网 页。而 Post 不是一个幂等的请求,一般用于对服务器资源会产生影响的情景。比如注册用户这一类的操作。

(2)因为不同的应用场景,所以浏览器一般会对 Get 请求缓存,但很少对 Post 请求缓存。

(3)从发送的报文格式来说,Get 请求的报文中实体部分为空,Post 请求的报文中实体部分一般为向服务器发送的数据。

(4)但是 Get 请求也可以将请求的参数放入 url 中向服务器发送,这样的做法相对于 Post 请求来说,一个方面是不太安全, 因为请求的 url 会被保留在历史记录中。并且浏览器由于对 url 有一个长度上的限制,所以会影响 get 请求发送数据时 的长度。这个限制是浏览器规定的,并不是 RFC 规定的。还有就是 post 的参数传递支持更多的数据类型。

TCP 解决拥塞的方案

  1. 慢开始
  2. 拥塞避免
  3. 快重传
  4. 快恢复

访问 url 到浏览器出现页面之间发生了什么?

  1. 输入 url,第一次访问无 DNS 缓存进行 DNS 查询根据域名获取 IP 地址
  2. TCP 三次握手建立链接 + TLS/SSL 安全握手后请求服务器返回请求资源(浏览器会将请求资源拷贝一份做下次缓存文件)
  3. 浏览器解析资源处理 HTML 生成 DOM 树
  4. 处理 CSS 构建 CSSOM 树,如果遇到 JS 会中断 DOM 解析去下载 JS 并执行,可以给 JS 添加 async/defer 异步下载
  5. DOM 和 CSSROM 合并成 Render Tree 渲染树
  6. 浏览器根据 Render Tree 渲染树渲染页面
  7. 调用 GPU 绘制页面,合成图层显示在屏幕上

DNS 查询过程

为了保证响应的及时,DNS 解析使用的是 UDP 协议.为了节省时间,可以在 HTML 头部去做 DNS 的预解析

比如查询 www.test.com这个域名,DNS的查询过程如下

  • 浏览器的 DNS 缓存;
  • 操作系统的 DNS 缓存(如 hosts);
  • 路由器的 DNS 缓存;
  • ISP(网络服务提供商)的LDNS 服务器查询
  • 向全球 13 台根域名服务器查询;
    • 根服务器返回顶级域名(TLD)服务器如.com.cn.org等的地址,该例子中会返回.com的地址
    • 接着向顶级域名服务器发送请求,然后会返回次级域名(SLD)服务器的地址,本例子会返回.test的地址
    • 接着向次级域名服务器发送请求,然后会返回通过域名查询到的目标 IP,本例子会返回www.test.com的地址

DNS 预查询

prefetch 预查询

<link rel="dns-prefetch" href="https://google.com/">

什么是 CDN?

CDN(Content Delivery Network)内容分发网络 是一个通过对源网站资源的缓存,利用本身多台位于不同地域、不同运营商的服务器,向用户提供资就近访问的 功能。也就是说,用户的请求并不是直接发送给源网站,而是发送给 CDN 服务器,由 CND 服务器将请求定位到最近的含有该资源 的服务器上去请求。这样有利于提高网站的访问速度,同时通过这种方式也减轻了源服务器的访问压力。

CDN 的好处和工作原理

tip CDN 的好处

  • 就近访问,加快网页加载速度
  • 负载均衡,减少源服务器压力
  • 更加安全,有效防御 DDOS 等网络攻击

CDN 工作原理

使用 CDN 缓存资源后的访问过程:

  1. 对于点击的数据的 URL,经过本地 DNS 系统的解析,发现该 URL 对应的是一个 CDN 专用的 DNS 服务器,DNS 系统就会将域名解析权交给 CNAME 指向的 CDN 专用的 DNS 服务器。
  2. CND 专用 DNS 服务器将 CND 的全局负载均衡设备 IP 地址返回给用户
  3. 用户向 CDN 的全局负载均衡设备发起数据请求
  4. CDN 的全局负载均衡设备根据用户的 IP 地址,以及用户请求的内容 URL,选择一台用户所属区域的区域负载均衡设备,告诉用户向这台设备发起请求
  5. 区域负载均衡设备选择一台合适的缓存服务器来提供服务,将该缓存服务器的 IP 地址返回给全局负载均衡设备
  6. 全局负载均衡设备把服务器的 IP 地址返回给用户
  7. 用户向该缓存服务器发起请求,缓存服务器响应用户的请求,将用户所需内容发送至用户终端。

如果缓存服务器没有用户想要的内容,那么缓存服务器就会向它的上一级缓存服务器请求内容,以此类推,直到获取到需要的资源。最后如果还是没有,就会回到自己的服务器去获取资源

http 状态码有哪些?304 代表什么?206 呢?

  • 2XX
    • 200 成功
    • 206 部分成功,文件上传断点续传
  • 3XX
    • 301 永久重定向
    • 302 临时重定向
    • 304 协商缓存命中
  • 4XX
    • 403 没有权限,被服务器禁止访问
    • 404 在服务器上找不到该资源
  • 5XX
    • 500 服务器端在执⾏请求时发⽣了错误
    • 503 服务器暂时处于超负载或正在停机维护,⽆法处理请求

强缓存和协商缓存

强缓存是强制缓存的意思,只要不是 nostore 和 nocache 都会先走强缓存

  • 缓存优先级
    • 强缓存 > 协商缓存
    • 强缓存: Cache Control > Expire
    • 协商缓存: ETag > Last Modyify

缓存策略是怎样的?缓存存放位置?

浏览器缓存就是把一个已经请求过的 web 资源(如 html 页面,图片,JS,数据)拷贝一份放在浏览器中

缓存策略

  • 首先通过Cache-Control 验证强缓存是否可用
    • 如果可用,则直接使用缓存(返回状态码 200)
    • 不可用,发送 http 请求进入协商缓存,根据服务器返回的响应头,决定是否缓存
  • 根据 If-None-Match(ETag) 和 If-Modified-Since (Last Modify) 来判断是否可以使用协商缓存
    • 资源有更新,返回状态码 200 和请求资源
    • 资源无修改,返回状态码 304,浏览器读取缓存
  • 强缓存是不需要发送 HTTP 请求的, 而协商缓存需要

    缓存位置

    • SERVICE WORKER
    • MEMORY CACHE
    • DISK CHCHE
    • PUSH CACHE
    • 发起请求

预加载和预渲染,预解析

prefetch 和 preload 的区别

  • Preload 来告诉浏览器预先请求当前页需要的资源,从而提高这些资源的请求优先级
  • Prefetch 来告诉浏览器用户将来可能在其他页面(非本页面)可能使用到的资源,那么浏览器会在空闲时,就去预先加载这些资源放在 http 缓存内,最常见的 dns-prefetch

    DNS 预解析

<link rel="dns-prefetch" href="https://google.com/" />

懒加载和按需加载

图片、长列表实现懒加载/延迟加载

  • 先加载可视区域内的内容,其他随着滚动的时候再陆续加载,提升网页性能的手段。
  • 原理就是 用自定义属性 data-xxx 存储图片真实地址,滚动时候再去替换 src
<!-- html -->
<img data-src="./images/1.jpg" alt="图片1">
<img data-src="./images/2.jpg" alt="图片2">
<img data-src="./images/3.jpg" alt="图片3">
<img data-src="./images/4.jpg" alt="图片4">
<img data-src="./images/5.jpg" alt="图片5">
<img data-src="./images/6.jpg" alt="图片6">
<img data-src="./images/7.jpg" alt="图片7">
<img data-src="./images/8.jpg" alt="图片8">
<img data-src="./images/9.jpg" alt="图片9">
<img data-src="./images/10.jpg" alt="图片10">

<!-- js -->
<script>
var imgs = document.querySelectorAll('img'); //获取所有img列表

//offsetTop是元素与offsetParent的距离,循环获取直到页面顶部
function getTop(e) {
var T = e.offsetTop;
while(e = e.offsetParent) {
T += e.offsetTop;
}
return T;
}

function lazyLoad(imgs) {
var H = document.documentElement.clientHeight;//获取可视区域高度
var S = document.documentElement.scrollTop || document.body.scrollTop;
for (var i = 0; i < imgs.length; i++) {
if (H + S > getTop(imgs[i])) {
imgs[i].src = imgs[i].getAttribute('data-src');
}
}
}

window.onload = window.onscroll = function () { //onscroll()在滚动条滚动的时候触发
lazyLoad(imgs);
}
</script>

websocket 理解,应用场景?

tip websocket 应用场景

  • 实时性强的
  • 弹幕、视频聊天、股票情况实时更新

WebSocket 是一种网络传输协议,是 HTML5 出的东西,并不属于 HTTP,用于解决 HTTP 的问题,但是随着 HTTP 不断升级,WS 的优点都被吸收过去了,就像现在原生 JS 吸收了许多 JQ 的优点,没必要使用 JQ 了。

  • ws 同时支持服务器推送(http 2.0 也有了)
  • 可以发送文本,也可以发送二进制数据,http2.0 和其类似,但具体实现有区别。
  • ws 没有同源限制,客户端可以与任意服务器通信,ajax 有跨域的限制。
  • ws 是全双工通信,需要握手建立链接,ajax 只能由客户端发起请求,服务端响应,ws 可以由客户端发起请求,服务端响应,也可以由服务端发起请求,客户端响应。