1.浅析 JavaScript 沙箱机制
2.qiankun 2.x 运行时沙箱 源码分析
3.微前端学习笔记(3):前端沙箱之JavaScript的虚拟虚拟sandbox（沙盒/沙箱）

浅析 JavaScript 沙箱机制

       JavaScript的沙箱机制是浏览器世界中的安全措施，它隔离未经信任的沙箱沙箱代码，确保其不会影响主程序的源码稳定运行。想象一下，虚拟虚拟它就像一个安全盒，沙箱沙箱限制内部程序对全局环境的源码播放窗口置顶源码直接访问，避免恶意代码篡改或污染。虚拟虚拟

       沙箱的沙箱沙箱应用场景广泛，尤其是源码在处理不可信第三方代码时，它能有效防止XSS攻击，虚拟虚拟保护全局window状态。沙箱沙箱要实现沙箱，源码核心是虚拟虚拟构建一个隔离的作用域，比如使用with语句在代码查找变量时，沙箱沙箱优先从预设的源码赤兔网站源码上下文对象查找，而非全局环境。不过，这还存在变量访问控制的问题，这时Proxy就派上用场，通过has方法拦截并监控变量访问，确保只有白名单内的变量能正常访问。

       对于更复杂的场景，如Web编辑器或需要共享全局状态的多个沙箱，iframe提供了天然的隔离，但维护多个沙箱的通信则需要更复杂的方法，如结合with、Proxy和postMessage。尽管如此，沙箱仍存在逃逸风险，庄家最怕源码开发者需要不断检测和防止意外的程序执行，这是一项持续的任务。

       尽管本文讨论了沙箱的基本原理、实现方式和挑战，但构建一个完备的沙箱需要不断优化和定制，因为它涉及到对源代码的深入理解和精细控制，就像构建一个自定义解释器一样。沙箱机制并非一劳永逸，它与"我的世界"一样，需要持续的创新和完善。

qiankun 2.x 运行时沙箱 源码分析

       本文详细解析了qiankun 2.x框架中的运行时沙箱，包括JS沙箱和样式沙箱的实现原理。沙箱在微前端解决方案中起着隔离作用，尤其是dnspy源码编译在single-spa框架基础上，qiankun解决了单个应用全局污染的问题。

       JS沙箱通过proxy代理window对象，记录其属性操作，微应用的所有操作都在这个proxy对象上，确保全局对象的干净。而样式沙箱则通过增强createElement和appendChild等方法，控制script、link、style标签的创建和添加，确保样式隔离，微应用卸载时能正确清理动态添加的样式。

       样式沙箱实际上是一个动态元素管理器，区分主应用和微应用的元素插入，并在微应用卸载后自动删除。源码如何算它还额外处理了scoped css模式下的样式。深入源码分析部分，可以查看createSandboxJS、SingularProxySandbox和样式沙箱相关函数，如patchAtBootstrapping和patchDocumentCreateElement等。

       最后，虽然源码分析有一定难度，但持续学习和实践将使这些技术变得熟悉。感谢大家的反馈和支持，关注微信公众号“李永宁lyn”，获取最新内容。文章已收录至GitHub，欢迎关注和星标。

微前端学习笔记(3):前端沙箱之JavaScript的sandbox（沙盒/沙箱）

       沙盒（Sandbox）机制旨在确保代码的安全性，限制其权限以防止恶意或不受信任的脚本访问敏感资源或干扰其他程序执行。通过在沙盒环境中运行代码，可以将其行为限制在安全范围之内。

       沙盒是一种隔离机制，允许程序在独立环境中运行，避免对外界程序造成影响，保障系统安全。在开发中，沙盒环境通常用于服务器中通过Docker创建容器，或在 Codesandbox中运行代码示例，以及在程序中执行动态脚本。

       微前端框架主要负责两个工作：一是实现JS沙盒，二是将沙盒内的执行结果输出为WebComponents，插入到页面中。

       沙盒能够确保每个前端应用拥有独立的上下文环境、页面路由和状态管理，避免相互干扰。

       实现JavaScript沙盒的方法有两类：通过iframe或ShadowRealm在原生环境上实现，以及利用JS特性（主要基于Proxy）实现。

       利用iframe实现沙盒是通过其天然的隔离机制和postMessage通讯机制。在iframe中运行的脚本只访问当前iframe的全局对象，不会影响父页面功能，提供简单、安全的实现方式。腾讯的无界沙箱采用此方案。

       使用iframe沙盒有一些限制，需要配置来解除限制。实际工程中，可以参考《让iframe焕发新生》一文，使用封装的框架wujie实现。

       无界沙箱模式在一张页面上激活多个子应用，利用iframe独立执行，并通过location和history管理路由，支持浏览器前进、后退操作。

       核心点包括：iframe数据劫持和注入、iframe与shadowRoot副作用处理。实现细节在无界源码中。

       ShadowRealm是一个ECMAScript标准提案，允许创建多个高度隔离的JS运行环境，具有独立的全局对象和内建对象。但目前仍处于提案阶段。

       WebWorker提供独立线程作为沙箱环境，适合作为底层实现，但不常提及。腾讯无界方案展示了其优势。

       IIFE（立即执行匿名函数）实现简易沙箱，可限制变量访问，但只能实现基本隔离。

       with + new Function提供访问全局变量和局部变量的能力，但存在全局作用域污染风险。

       利用with和Function结合Proxy实现ES6 Proxy，通过拦截器get和set对window进行代理，实现全局环境的隔离。

       沙箱逃逸是极端情况下的安全挑战，通过设置Symbol.unScopables为true来绕过with作用域限制。

       沙盒实现包括简单代码实现和多实例模式，分别通过with块和Proxy对象隔离执行环境。单实例模式只支持记录变化，多实例模式则在微应用间创建独立的沙箱环境。

       基于属性diff的沙箱机制在不支持ES6的环境中使用普通对象快照实现存储与恢复，用于更新子应用环境。qiankun中提供了此降级方案。

       总结：沙盒机制是实现代码安全隔离的有效手段，通过不同方法实现沙箱，可以满足不同场景的需求。在实现时需考虑限制与优化，确保安全性和性能。