JavaScript沙箱通过作用域隔离、全局代理、iframe隔离和AST转译实现代码安全执行，防止污染主环境。1. 用IIFE或with限制变量暴露；2. Proxy拦截对全局对象的访问，模拟受限环境；3. iframe提供强隔离，配合postMessage通信；4. AST分析重写代码，控制全局引用。根据安全需求选择方案，核心是限制不可信代码权限。
在前端开发中，JavaScript沙箱环境用于安全地执行不可信代码，实现代码隔离，防止对主程序造成影响。这种机制广泛应用于插件系统、在线代码编辑器（如CodePen）、低代码平台和模块化应用中。构建一个可靠的沙箱，核心目标是控制作用域、限制全局访问、拦截危险操作。
1. 作用域隔离：通过函数闭包限制变量暴露
最基础的隔离方式是利用函数作用域或块级作用域，避免污染全局环境。
使用立即执行函数（IIFE）可创建独立作用域：
(function() {
var localVar = '仅在此作用域有效';
// 外部无法访问 localVar
})();
若需传递上下文，可传入受限的变量：
立即学习“Java免费学习笔记（深入）”；
function createSandbox(context) {
return function(code) {
with(context) {
return eval(code);
}
};
}
注意：with 和 eval 存在安全与性能问题，仅作示例，生产环境应避免。
2. 全局对象代理：拦截对 window/global 的访问
直接执行第三方脚本可能读写全局对象，导致安全漏洞。可通过 Proxy 拦截属性访问，模拟受限全局环境。
例如，创建一个只允许访问部分 API 的 fakeGlobal：
const fakeGlobal = {
console,
setTimeout,
// 不暴露 document、localStorage 等敏感接口
};
const sandboxGlobal = new Proxy(fakeGlobal, {
has: (target, prop) => prop in target,
get: (target, prop) => {
if (prop in target) return target[prop];
throw new Error(`Blocked access to global.${prop}`);
},
set: (target, prop, value) => {
if (prop in target) {
target[prop] = value;
return true;
}
throw new Error(`Blocked write to global.${prop}`);
}
});
将代码包裹在 with 中并绑定到代理对象，实现基本隔离。
3. 使用 iframe + postMessage 实现强隔离
浏览器原生提供了 iframe 作为天然的沙箱容器。不同源的 iframe 拥有独立的全局上下文，是最安全的隔离方式。
方案步骤：
- 创建隐藏 iframe，设置 sandbox 属性（如 allow-scripts）
- 动态注入待执行代码
- 通过 postMessage 与父页面通信
- 父页面监听 message 事件获取结果或日志
优点是完全隔离 DOM、Cookie、Storage；缺点是调试困难，跨域通信需额外处理。
4. AST 转译：静态分析 + 重写代码
更高级的方案是解析 JavaScript 代码为抽象语法树（AST），重写变量引用，将全局访问替换为受控调用。
工具如 Babel 可以遍历 AST，识别 window.、document. 等节点并替换为 sandbox.window 或抛出错误。
这种方式可在执行前彻底控制代码行为，适合低代码平台或插件系统。
基本上就这些常见方案。选择哪种取决于安全等级需求：简单隔离可用 Proxy + with，高安全性推荐 iframe，定制化强可用 AST 分析。关键是不信任任何外部代码，始终限制其权限。
