第 7 卷

说下 TCP 握手和挥手过程

三次握手，五次挥手，每㇐次的目的要知道

HTTP 1.1 的队头阻塞问题编解码/加密 base64

encodeURIComponent / decodeURIComponent 对称加密

非对称加密数字签名/验签

工程能力

模块化介绍？CMD 和 ESM 的区别：

mjs 是什么？

什么是 Tree Shaking？其基本原理是什么？按需加载的实现原理

Webpack 的㇐些细节代码规范细节

Git工作流细节 npm 相关

Web 安全

从攻击者和防御者的角度来看 Web 安全，而不是背书。

跨域

跨域主要是针对 Javascript 的限制，防止恶意的脚本窃取/破坏/滥用用户数据。

什么是跨域？

同源的判断三要素是协议、主机（域名/IP）、端口，只要三者中任何㇐个不同，就会发生跨域。

• 写操作或嵌入操作是允许的，读操作是禁止的：很奇怪吧？你可以在在网站中链接到其他网站，或者提交跨域的表单；你也可以嵌入跨域的图片，视频等

媒体资源，甚至嵌入跨域的

iframe（前提是 X-Frame-Options 不被设置为 Deny 等值）；但是你不能通过 canvas 跨域图片的文件细节。

• 为什么 form 不被同源策略限制：form 提交㇐个action 后，其处理过程完全交由浏览器和目标服务器，是不能指定脚本回调的。而通过 Ajax 发出的请求

是可以获取到响应内容的，这就有极大风险，所以浏览器同源策略限制了跨域 Ajax 和 Fetch。但是，这也不是说 form 就是安全的，诱骗表单或 XSS 注入

的恶意表单也是危险性很高的。

• canvas 操作图片的跨域：
• XMLHTTPRequest：无法跨域请求，这个是遇到最多的。
• preflight（预检）：
• Cookie：出于安全考虑，无法跨域读取或设置 cookie（无论是从服务端还是客户端）。只能通过将 cookie 的 domain 设置为㇐个父域名来达到父域名下

站点共享该 cookie 的目的。

如何解决跨域问题？

• jsonp
• CORS
• nginx 反向代理
• nodejs 服务代理

同源和同站

Same Origin 和 Same Site 的判断依据。TLD 和 eTLD。

点击劫持 Click Jacking

黑客通过㇐个iframe 嵌套了目标网站，并通过㇐些 opacity 等技巧，在最上层覆盖㇐些恶意网站的链接，诱骗用户点击。用户以为自己访问的是百度，其实是

㇐个假百度（黑客的域名进去的，但是

用户没注意域名，只看到界面是百度）。

解决方案：HTTP headers 设置X-FRAME-OPTIONS，用deny 或者 sameorigin 是比较安全的，或者通过 allow-from 指定 URI白名单。

中间人攻击

Man-in-the-middle attack <https://developer.mozilla.org/en-US/docs/Glossary/MitM>，通信过程被黑客劫持，就像邮递员可能篡改邮件㇐样。

预防中间人攻击：使用HTTPS；用户认证信息和 IP 做绑定。

什么是 XSS 攻击？防御手段

XSS 是 Crossing-Site-Scripting，也就是跨站脚本攻击，指的是黑客恶意在目标网站植入㇐段脚本，用于窃取用户信息和伪装成用户，甚至执行其他恶意行

为。常发生于未对用户输入做校验和未对 innerHTML 做过滤的情况。

XSS 防御手段

什么是 CSRF 攻击？防御手段

CSRF 防御手段

• Set-Cookie 增加 SameSite 约束
• 不使用Cookie 这种自动携带的身份验证手段，改用JWT 等自定义 Request Header 的方案。
• CSRF Token
• 关键业务用验证码等方式强制校验。

Typescript

private, protected, public type, interface 类型和接口联合类型，交

叉类型

泛型

keyof, typeof 的使用

Utility Type 的实现原理

计算机网络

CDN，回源

CDN 是内容分发网络，源站提供内容，CDN 节点进行内容分发，用户可以就近获取所需内容，降低网络拥塞，提高用户访问响应速度和命中率。

回源，当有用户访问某㇐个URL 的时候，如果被解析到的那个 CDN 节点没有缓存响应的内容，或者是缓存已经到期，就会回源站去获取。如果没有人访问，

那么 CDN 节点不会主动去源站拿的。

回源的策略间接决定了缓存的命中率，频繁回源会对源站产生较大的负担。

算法修炼

常见数据结构

• 数组（线性表）
• 链表（单向链表，双向链表，循环链表）
• 栈
• 队列，优先队列
• 哈希表
• 堆：最大堆，最小堆
• 树：二叉树，红黑树