2020前端一些大厂面经系列———网络（下）

接上篇

网络

11.1 HTTP1.0 与 HTTP1.X相比有哪些区别？(腾讯)

• HTTP1.0 定义了三种请求方法： GET, POST 和 HEAD 方法。HTTP1.1 新增了六种请求方法：OPTIONS、PUT、PATCH、DELETE、TRACE 和 CONNECT 方法。
• 缓存处理：HTTP1.0中主要使用header里的If-Modified-Since,Expires来做为缓存判断的标准，HTTP1.1引入了更多的缓存控制策略例如Entity tag，If-Unmodified-Since, If-Match, If-None-Match等更多可供选择的缓存头来控制缓存策略。
• 带宽优化：HTTP1.0中，存在一些浪费带宽的现象，例如客户端只是需要某个对象的一部分，而服务器却将整个对象送过来了，并且不支持断点续传功能，HTTP1.1则在请求头引入了range头域（用来支持断点续传），它允许只请求资源的某个部分，即返回码是206，方便开发者自由的选择以便于充分利用带宽和连接。
• 错误状态码增加：在HTTP1.1中新增了24个错误状态响应码，如409（Conflict）表示请求的资源与资源的当前状态发生冲突；410（Gone）表示服务器上的某个资源被永久性的删除。
• Host头处理：在HTTP1.0中认为每台服务器都绑定一个唯一的IP地址，因此，请求消息中的URL并没有传递主机名（hostname）。但随着虚拟主机技术的发展，在一台物理服务器上可以存在多个虚拟主机（Multi-homed Web Servers），并且它们共享一个IP地址。HTTP1.1的请求消息和响应消息都应支持Host头域，且请求消息中如果没有Host头域会报告一个错误（400 Bad Request）。
• 长连接：HTTP 1.1支持长连接和请求的流水线处理，在一个TCP连接上可以传送多个HTTP请求和响应，减少了建立和关闭连接的消耗和延迟，HTTP1.1中默认开启Connection:keep-alive，而不是1.0的每次请求都要创建连接。通过设置http的请求头部和应答头部，保证本次数据请求结束之后，下一次请求仍可以重用这一通道，避免重新握手。
  11.2 HTTP2.0 与 HTTP1.X相比有哪些区别？(字节跳动)

• 新的二进制格式：HTTP1.x的解析是基于文本。基于文本协议的格式解析存在天然缺陷，文本的表现形式有多样性，要做到健壮性考虑的场景必然很多，二进制则不同，只认0和1的组合。基于这种考虑HTTP2.0的协议解析决定采用二进制格式，实现方便且健壮。
• 多路复用：即连接共享，即每一个request都是是用作连接共享机制的。一个request对应一个id，这样一个连接上可以有多个request，每个连接的request可以随机的混杂在一起，接收方可以根据request的 id将request再归属到各自不同的服务端请求里面。而且HTTP 2.0 所有通信都在一个 TCP 连接上完成。简单讲就是一次TCP连接可以发送多个HTTP请求
• 决定优先级： HTTP 2.0 浏览器可以在发现资源时立即分派请求，指定每个流的优先级，让服务器决定最优的响应次序。
• header压缩：HTTP1.x的header带有大量信息，而且每次都要重复发送，HTTP2.0使用了专门为首部压缩而设计的 HPACK 算法，使用encoder来减少需要传输的header大小，通讯双方各自cache一份header fields表，既避免了重复header的传输，又减小了需要传输的大小。
• 服务端推送：服务端推送能把客户端所需要的资源伴随着index.html一起发送到客户端，省去了客户端重复请求的步骤。（例如网页有一个sytle.css的请求，在客户端收到sytle.css数据的同时，服务端会将sytle.js的文件推送给客户端，当客户端再次尝试获取sytle.js时就可以直接从缓存中获取到，不用再发请求了）

12. 后台发送数据时前端怎么确保数据的安全性？（腾讯）

一是通信时采用HTTPS传输数据
二是接口请求参数中加入签名防止参数被纂改
三是对所有请求和响应都进行加解密操作
13. HTTP和HTTPS区别有哪些？（腾讯）

• HTTP是超文本传输协议，但是它在安全方面有很大的漏洞： 它是明文传送数据的，数据容易遭到窃听，然后它的报文问容易遭到纂改，它也不会验证通信方的身份，容易遭到伪装
• HTTPS协议需要到CA申请证书，一般免费证书很少，需要交费。
• HTTP协议运行在TCP之上，所有传输的内容都是明文，HTTPS运行在SSL/TLS之上，SSL/TLS运行在TCP之上，所有传输的内容都经过加密的。（SSL/TLS的工作原理是基于散列函数，对称加密和非对称加密来实现的）
• HTTP和HTTPS使用的是完全不同的连接方式，用的端口也不一样，前者是80，后者是443。
• HTTPS可以有效的防止运营商劫持【dns劫持(重定向到钓鱼网站)和http劫持(由于http明文且经运营商)】，解决了防劫持的一个大问题。
  总结一下就是 HTTPS = HTTP + 网站认证 + 数据加密 + 完整性验证
  14. 说一下HTTPS握手过程（腾讯）
• 客户端给出协议的版本号、一个客户端生成的随机数1和客户端支持的加密算法；
• 服务端收到后在客户端给出的加密算法列表中选出一种，并给出数字证书和一个服务端生成的随机数2；
• 客户端确认数字证书的有效性，然后生成一个新的随机数3，并使用数字证书中的公钥加密这个随机数；
• 服务端使用私钥解密，获取客户端发来的随机数3；（前面这段是非对称加密）
  客户端和服务端根据约定的加密方法，使用之前的三个随机数，生成对话密钥，这个密钥会用来加密接下来的整个通信过程（对称加密）

15. TCP握手过程为什么是三次？（腾讯）

SYN表示建立连接，
FIN表示关闭连接，
ACK表示响应

因为三次双方才能互相确定对方的发生接受能力都是好的，第一次握手服务端可以确定客户端的发送那里和自身的接受能力，第二次握手客户端能确定服务端的发送能力和接受能力，自身的发送接受能力，但是不进行第三次的话服务器段不能确定客户端的接受能力。

客户端发送SYN报文给服务器端，进入SYN_SEND状态。
服务器端收到SYN报文，回应一个SYN（SEQ=y）ACK（ACK=x+1）报文，进入SYN_RECV状态。
客户端收到服务器端的SYN报文，回应一个ACK（ACK=y+1）报文，进入Established状态。
三次握手完成，TCP客户端和服务器端成功地建立连接，可以开始传输数据了。

16. TCP挥手过程为什么是四次？（腾讯）
因为TCP是全双工模式，因此每个方向都必须单独进行关闭，每个方向都需要一个FIN和一个ACK，因此通常需要4个分节;当客户端发送FIN报文时只是告诉服务端它的数据传送结束了 但是此时客户端还是可以接受数据的 然后服务器收到后发送ACK报文段表示它知道客户端没有数据要传送了,但是此时服务器还是可以向客户端发送数据的,然后服务器发送FIN报文段,告诉客户端它这边的数据也发送完毕;最后客户端收到后发送ACK报文段确认 之后他们就会愉快的断开连接了。

17. 对cookie的了解，用处和缺点（安全性问题）（腾讯）
因为HTTP是无状态的 因此cookie的出现是为了帮助web站点保存用户的信息例如id，name一类身份标识。

原理： 如上图所示，第一次访问网站的时候，浏览器发出请求，服务器响应请求后，会将cookie放入到响应请求中，在浏览器第二次发请求的时候，会把cookie带过去，服务端会辨别用户身份，当然服务器也可以修改cookie内容。
重要属性： 有 name，value，domain path expires max-age httpOnly

• domain：cookie可以使用的范围，可以设置自身，可以设置子域，可以设置父域 eg: 两个子域要互相访问的话，将document.domain设置为他们共同的父域；domain使用的前提： 同端口 同协议 基础域名相同
• domain和path共同限制了cookie可以使用的url 只有“domain/home”下的所有url可以访问该cookie（ 每个cookie都会绑定单一的域名）
• expires 是 http/1.0协议中的选项，在新的http/1.1协议中expires已经由 max-age 选项代替 若不设置max-age 默认时长为session时长 即会话关闭后消失
• httpOnly被设置后无法通过document.cookie设置cookie了

缺点：

• cookie可能被禁用；
• cookie与浏览器相关，不能互相访问；
• cookie可能被用户删除；
• cookie安全性不够高；（Cookie窃取）
• cookie存储空间很小(只有4–10KB左右)

18. 了解Cookie窃取和Cookie截获吗？（腾讯）

• Cookie窃取：Cookie记录了用户的帐户ID、密码之类的信息，通常使用MD5方法加密后在网上传递。经过加密处理后的信息即使被网络上一些别有用心的人截获也看不懂。然而，现在存在的问题是，截获Cookie的人不需要知道这些字符串的含义，只要把别人的Cookie向服务器提交（XSS攻击），并且能够通过验证，就可以冒充受害人的身份登陆网站，这种行为叫做Cookie窃取或者cookie欺骗。
  非法用户通过Cookie欺骗获得相应的加密密钥，从而访问合法用户的所有个性化信息，包括用户的E-mail甚至帐户信息，对个人信息造成严重危害。
• Cookie截获：Cookie以纯文本的形式在浏览器和服务器之间传送，很容易被他人非法截获和利用。任何可以截获Web通信的人都可以读取Cookie。Cookie被非法用户截获后，然后在其有效期内重放，则此非法用户将享有合法用户的权益。例如，对于在线阅读，非法用户可以不支付费用即可享受在线阅读电子杂志。

19. 从url输入到页面渲染发生了什么？（腾讯）

• DNS 域名解析（域名解析成ip地址，走UDP协议，因此不会有握手过程）：浏览器将 URL 解析出相对应的服务器的 IP 地址（1. 本地浏览器的 DNS 缓存中查找 2. 再向系统DNS缓存发送查询请求 3. 再向路由器DNS缓存 4. 网络运营商DNS缓存 5. 递归搜索），并从 url 中解析出端口号
• 浏览器与目标服务器建立一条 TCP 连接（三次握手）
• 浏览器向服务器发送一条 HTTP 请求报文
• 服务器返回给浏览器一条 HTTP 响应报文
• 浏览器进行渲染
  • HTML 解析出 DOM Tree
  • CSS 解析出 Style Rules
  • 两者关联生成 Render Tree
  • 回流（也叫重排）重绘
  • 展示 将像素发送给GPU，展示在页面上
• 关闭 TCP 连接（四次挥手）最后一步千万不要忘记！！！

浏览器解析文档的过程中，如果遇到 script 标签，会立即解析脚本，停止解析文档（因为 JS 可能会改变 DOM 和 CSS,如果继续解析会造成浪费）。
如果是外部 script, 会等待脚本下载完成之后在继续解析文档。现在 script 标签增加了 defer 和 async 属性，脚本解析会将脚本中改变 DOM 和 css 的地方> 解析出来，追加到 DOM Tree 和 Style Rules 上

重绘　 绘制页面像素信息 例如改变visibility、outline、背景色等属性
回流（重排） 负责各元素尺寸、位置的计算，确定坐标大小换行
回流一定伴随着重绘，重绘却可以单独出现

20. 讲一讲浏览器缓存 || 304过程（腾讯）

304协商缓存是比较基础的知识。一旦提起304协商缓存，面试官一定会忍不住问什么是协商缓存

浏览器缓存分为强制缓存和协商缓存，优先读取强制缓存。

• 强制缓存分为expires和cache-control，而expires是一个特定的时间，是比较旧的标准；而cache-control通常是一个具体的时间长度，比较新，优先级也比较高。
• 协商缓存包括etag和last-modified，last-modified的设置标准是资源的上次修改时间，而etag是为了应对资源修改时间可能很频繁的情况出现的，是基于资源的内容计算出来的值，因此优先级也较高。
• 协商缓存与强制缓存的区别在于强制缓存不需要访问服务器，返回结果是200，协商缓存需要访问服务器，如果命中缓存的话，返回结果是304。
  

下一篇点这里：2020前端一些大厂面经系列———vue

面经系列：
2020前端一些大厂面经系列———HTML，CSS，算法
2020前端一些大厂面经系列———JS
2020前端一些大厂面经系列———ES6
2020前端一些大厂面经系列———网络（上）
2020前端一些大厂面经系列———网络（下）
2020前端一些大厂面经系列———vue,node
2020前端一些大厂面经系列———综合实战篇