本文是对 一文彻底搞懂前端沙箱 (opens new window) 一文的精读，并进行部分内容补充

内容概要

1. 沙箱是什么？
2. 前端哪些场景需要用到沙箱？
   1. 业界应用举例
   2. 业务场景发散
3. 怎么实现前端沙箱？
   1. 关注点
   2. web 和 node 的差异
   3. 技术实现
   4. 如何避免安全问题？
4. 如何避免动态执行脚本问题？

1. 沙箱是什么？

一种虚拟容器，可以安全运行不受信任的程序，且不影响外部宿主环境。 https://en.wikipedia.org/wiki/Sandbox_(computer_security)

核心能力：

• 环境隔离
• 宿主安全
• 程序不可枚举

沙箱范围大至操作系统层级（VMware、Docker），小至飞书文档的网页内嵌功能

2. 前端哪些场景需要用到沙箱？

• 业界应用举例
  • CodeSandbox
  • 小程序
  • 微前端
• 业务场景发散（团队讨论）
  • Ultraman 自动化测试
  • 发文-微前端

3. 如何实现前端沙箱？

核心关键点：作用域隔离、宿主能力限制

Web 关注点：

• 作用域隔离
• 样式隔离

作用域：

• proxy、闭包：基于浏览器的 api 进行隔离，容易被绕过
• iframe：
• ShadowRealm：提供独立的运行环境，还在草稿阶段 https://tc39.es/proposal-shadowrealm/

样式：

• ShadowDOM：可以将某个 DOM 节点变成隔离节点，该隔离节点的样式和外部 DOM 树完全独立，相互不影响
• iframe
• CSS Module
• namespace
• Dynamic StyleSheet
• css in js

Node 关注点：

• 作用域隔离
• 线程隔离，IO 隔离

node 提供内置的模块 vm ，代码直接运行在 v8 ，实现执行环境隔离

存在的问题：

• 可以访问 process 对象

vm2

如何避免安全问题 白名单机制