面经答案收集

169 阅读4分钟

1. 浏览器是如何校验证书的

通过信任链,其中存在根证书预存在操作系统中,仅可以通过更新系统下载,时效性大约20年)、中间证书由根证书签发,可自动批量签发叶证书)和叶证书由服务端发送给客户端)。

由证书A签发证书B:

  • 计算B的hash值
  • 使用A的私钥加密hash值,即生成签名
  • 将签名附在B证书里 验证B证书:
  • 使用A证书公钥解密B证书签名
  • 匹配A和B的hash值

2. webpack的require如何查找依赖

(1)参数是路径

如果是相对路径会先转换成绝对路径。

require("./module.js")

如果指定了扩展名的,只需要判断文件是否存在即可。

require("./module")

如果没有扩展名,按照以下顺序查找:

  • 先认为参数是文件,按照配置 resolve.extensions 的顺序查找,没有就按照 js,json,node 的顺序。
  • 没有匹配到就认为参数是目录,没有返回失败。
  • 如果目录存在,会查找目录下是否存在 package.json 文件和文件内是否存在 main 字段,没有返回失败。
  • 在目录内查找 main 字段指定的入口文件,不存在就按照(index.js,index.json,index.node)顺序查找,没有返回失败,结束。
require("module")

(2)参数是模块名称

  • 首先判断是否为核心模块,有则直接加载,比如 http 。
  • 不是就认为第三方模块,先会在当前文件所在目录查找是否存在 node_modules,没有就继续往父目录查找,直到磁盘根目录。

require 第一次是加载执行,之后都是优先在缓存中查找,没有命中才按上述方式查找。"./" 相对路径是相对当前模块,不受执行 node 命令的路径影响。

3. 如何与服务端保持长连接

(1)ajax轮询

优点: 成本相对低,可实现简单数据更新
缺点: 会导致多次请求资源浪费

(2)长轮询

客户端设置请求头connection: keep-alive,服务端如果没有数据可以立刻返回,会将请求挂起,先处理其他请求,直到有数据返回

优点: 减少请求次数,降低无效网络传输,保证每次请求都有数据,不过多占用客户端线程
缺点: 保持连接占用服务端资源,高并发可能会达到TCP连接数上限

(3)iframe长连接

在网页上嵌入一个 iframe 标签,该标签的 src 属性指向一个长连接请求。这样服务端就可以源源不断地给客户端传输信息。保障信息实时更新。

优缺点同上

(4)WebSocket

建立在TCP上的WebSocket协议可实现双向通信,握手阶段使用HTTP协议,连接后通过TCP通道传输。

Websoket 数据传输是通过 frame 形式,一个消息可以分成几个片段传输。这样大数据可以分成一些小片段进行传输,不用考虑由于数据量大导致标志位不够的情况。也可以边生成数据边传递消息,提高传输效率。

优点:

  • 双向通信。客户端和服务端双方都可以主动发起通讯。
  • 没有同源限制。客户端可以与任意服务端通信,不存在跨域问题。
  • 数据量轻。第一次连接时需要携带请求头,后面数据通信都不需要带请求头,减少了请求头的负荷。
  • 传输效率高。因为只需要一次连接,所以数据传输效率高。 缺点:
  • 长连接需要后端处理业务的代码更稳定,推送消息相对复杂;
  • 长连接受网络限制比较大,需要处理好重连。
  • 兼容性,WebSocket 只支持 IE10 及其以上版本。
  • 服务器长期维护长连接需要一定的成本,各个浏览器支持程度不一;
  • 成熟的 HTTP 生态下有大量的组件可以复用,WebSocket 则没有,遇到异常问题难以快速定位快速解决。

4. 函数缓存

blog.csdn.net/weixin_3092…

5. 跨页面通信

juejin.cn/post/684490…

6. keep-alive与多路复用的区别

juejin.cn/post/694463…

7. HTTP2头部压缩原理

HPACK算法 juejin.cn/post/684490…

8. 扫码登录原理

juejin.cn/post/694097…

9. qiankun沙箱隔离原理

juejin.cn/post/707003…

10. margin重叠

juejin.cn/post/702688…

11. 前端安全对抗

mp.weixin.qq.com/s/FSlc676u8…