Question

我想知道是否可以在浏览器中运行JavaScript沙箱，以防止访问HTML页面中运行的JavaScript代码通常可用的功能。

例如，假设我想为最终用户提供一个JavaScript API，让他们定义在“有趣事件”发生时运行的事件处理程序，但我不希望这些用户访问该属性和函数window对象。我能做到吗？

在最简单的情况下，假设我想阻止用户呼叫alert。我能想到的几种方法是：

全局重新定义window.alert。我认为这不是一种有效的方法，因为页面中运行的其他代码（即用户未在其事件处理程序中创作的内容）可能希望使用alert。
将事件处理程序代码发送到要处理的服务器。我不确定将代码发送到服务器进行处理是正确的方法，因为事件处理程序需要在页面的上下文中运行。

也许服务器处理用户定义函数然后生成要在客户端上执行的回调的解决方案可行吗？即使这种方法有效，是否有更好的方法来解决这个问题？

Answer 1

Google Caja是一个源到源的翻译器，“允许您将不受信任的第三方HTML和JavaScript内嵌到您的页面中，并且仍然是安全的。”

Answer 2

查看Douglas Crockford's ADsafe：

ADsafe可以将访客代码（例如第三方脚本广告或小部件）放在任何网页上。 ADsafe定义了一个强大的JavaScript子集，允许访客代码执行有价值的交互，同时防止恶意或意外损坏或入侵。 ADsafe子集可以通过JSLint等工具进行机械验证，因此无需人工检查即可查看访客代码的安全性。 ADsafe子集还实施了良好的编码实践，增加了访客代码正确运行的可能性。

您可以通过查看the project's GitHub repository中的template.html和template.js文件来查看如何使用ADsafe的示例。

Answer 3

我创建了一个名为jsandbox的沙盒库，它使用Web worker对沙盒进行评估。它还有一个输入方法，用于显式提供它本来无法获得的沙盒代码数据。

以下是API的示例：

jsandbox
    .eval({
      code    : "x=1;Math.round(Math.pow(input, ++x))",
      input   : 36.565010597564445,
      callback: function(n) {
          console.log("number: ", n); // number: 1337
      }
  }).eval({
      code   : "][];.]\\ (*# ($(! ~",
      onerror: function(ex) {
          console.log("syntax error: ", ex); // syntax error: [error object]
      }
  }).eval({
      code    : '"foo"+input',
      input   : "bar",
      callback: function(str) {
          console.log("string: ", str); // string: foobar
      }
  }).eval({
      code    : "({q:1, w:2})",
      callback: function(obj) {
          console.log("object: ", obj); // object: object q=1 w=2
      }
  }).eval({
      code    : "[1, 2, 3].concat(input)",
      input   : [4, 5, 6],
      callback: function(arr) {
          console.log("array: ", arr); // array: [1, 2, 3, 4, 5, 6]
      }
  }).eval({
      code    : "function x(z){this.y=z;};new x(input)",
      input   : 4,
      callback: function(x) {
          console.log("new x: ", x); // new x: object y=4
      }
  });

Answer 4

我认为js.js值得一提。它是用JavaScript编写的JavaScript解释器。

它比原生JS慢大约200倍，但它的本质使它成为一个完美的沙盒环境。另一个缺点是它的大小 - 几乎600 kb，在某些情况下可能适用于台式机，但不适用于移动设备。

Answer 5

正如其他回应中所提到的，它足以将沙盒iframe中的代码监禁（不将其发送到服务器端）并与消息进行通信。我建议看看我创建的small library主要是因为需要为不受信任的代码提供一些API，就像问题中所描述的那样：有机会导出特定的集合函数直接进入不受信任的代码运行的沙箱中。此外，还有一个演示程序，用于执行用户在沙箱中提交的代码：

http://asvd.github.io/jailed/demos/web/console/

Answer 6

所有浏览器供应商和HTML5规范都在努力实现沙盒属性以允许沙盒iframe - 但它仍然仅限于iframe粒度。

一般来说，没有任何正则表达式等可以安全地清理任意用户提供的JavaScript，因为它会退化为暂停问题： - /

Answer 7

一种丑陋的方式，但也许这适合你，我把所有全局变量并在沙箱范围内重新定义它们，我添加了严格模式，因此它们无法使用匿名函数获取全局对象。

function construct(constructor, args) {
  function F() {
      return constructor.apply(this, args);
  }
  F.prototype = constructor.prototype;
  return new F();
}
// Sanboxer 
function sandboxcode(string, inject) {
  "use strict";
  var globals = [];
  for (var i in window) {
    // <--REMOVE THIS CONDITION
    if (i != "console")
    // REMOVE THIS CONDITION -->
    globals.push(i);
  }
  globals.push('"use strict";\n'+string);
  return construct(Function, globals).apply(inject ? inject : {});
}
sandboxcode('console.log( this, window, top , self, parent, this["jQuery"], (function(){return this;}()));'); 
// => Object {} undefined undefined undefined undefined undefined undefined 
console.log("return of this", sandboxcode('return this;', {window:"sanboxed code"})); 
// => Object {window: "sanboxed code"}

https://gist.github.com/alejandrolechuga/9381781

Answer 8

@ RyanOHara的网络工作者沙箱代码的改进版本，在单个文件（无需额外的eval.js文件）。

function safeEval(untrustedCode)
    {
    return new Promise(function (resolve, reject)
    {

    var blobURL = URL.createObjectURL(new Blob([
        "(",
        function ()
            {
            var _postMessage = postMessage;
            var _addEventListener = addEventListener;

            (function (obj)
                {
                "use strict";

                var current = obj;
                var keepProperties = [
                    // required
                    'Object', 'Function', 'Infinity', 'NaN', 'undefined', 'caches', 'TEMPORARY', 'PERSISTENT', 
                    // optional, but trivial to get back
                    'Array', 'Boolean', 'Number', 'String', 'Symbol',
                    // optional
                    'Map', 'Math', 'Set',
                ];

                do {
                    Object.getOwnPropertyNames(current).forEach(function (name) {
                        if (keepProperties.indexOf(name) === -1) {
                            delete current[name];
                        }
                    });

                    current = Object.getPrototypeOf(current);
                }
                while (current !== Object.prototype);
                })(this);

            _addEventListener("message", function (e)
            {
            var f = new Function("", "return (" + e.data + "\n);");
            _postMessage(f());
            });
            }.toString(),
        ")()"], {type: "application/javascript"}));

    var worker = new Worker(blobURL);

    URL.revokeObjectURL(blobURL);

    worker.onmessage = function (evt)
        {
        worker.terminate();
        resolve(evt.data);
        };

    worker.onerror = function (evt)
        {
        reject(new Error(evt.message));
        };

    worker.postMessage(untrustedCode);

    setTimeout(function () {
        worker.terminate();
        reject(new Error('The worker timed out.'));
        }, 1000);
    });
    }

测试它：

https://jsfiddle.net/kp0cq6yw/

var promise = safeEval("1+2+3");

promise.then(function (result) {
      alert(result);
      });

应输出6（在Chrome和Firefox中测试）。

Answer 9

截至2019年，vm2似乎是针对此问题的最受欢迎且更新最频繁的解决方案。

Answer 10

独立的Javascript解释器更有可能产生一个强大的沙箱而不是内置浏览器实现的笼式版本。 Ryan有already mentioned js.js，但更新的项目是JS-Interpreter。 docs涵盖了如何向解释器公开各种函数，但其范围非常有限。

Answer 11

使用NISP，您将可以进行沙盒评估。尽管您编写的表达式并非完全是JS，但是您将编写s-expressions。不需要大量编程的简单DSL的理想选择。

Answer 12

此用户JavaScript来自哪里？

用户将代码嵌入到页面中然后从浏览器中调用它（参见Greasemonkey，http://www.greasespot.net/），您无能为力。这只是浏览器所做的事情。

但是，如果您将脚本存储在数据库中，然后检索它并eval（）它，那么您可以在脚本运行之前清理它。

删除所有窗口的代码示例。和文件。引用：

 eval(
  unsafeUserScript
    .replace(/\/\/.+\n|\/\*.*\*\/, '') // Clear all comments
    .replace(/\s(window|document)\s*[\;\)\.]/, '') // removes window. or window; or window)
 )

这会阻止执行以下命令（未测试）：

window.location = 'http://mydomain.com';
var w = window  ;

您必须应用于不安全的用户脚本有很多限制。不幸的是，JavaScript没有“沙盒容器”。

Answer 13

1）假设您有一个要执行的代码：

var sCode = "alert(document)";

现在，假设您要在沙箱中执行它：

new Function("window", "with(window){" + sCode + "}")({});

执行这两行时会失败，因为“沙盒”

中没有“警告”功能

2）现在你想用你的功能公开一个window对象的成员：

new Function("window", "with(window){" + sCode + "}")({
    'alert':function(sString){document.title = sString}
});

确实你可以添加引号转义并进行其他抛光，但我想这个想法很清楚。

Answer 14

我一直在研究一个简单的js沙箱，让用户为我的网站构建applet。虽然我仍然面临一些允许DOM访问的挑战（parentNode只是不让我保持安全= /），我的方法只是用一些有用/无害的成员重新定义窗口对象，然后eval（）用户将此重新定义的窗口作为默认范围的代码。

我的“核心”代码就像这样......（我没有完全展示它;）

function Sandbox(parent){

    this.scope = {
        window: {
            alert: function(str){
                alert("Overriden Alert: " + str);
            },
            prompt: function(message, defaultValue){
                return prompt("Overriden Prompt:" + message, defaultValue);
            },
            document: null,
            .
            .
            .
            .
        }
    };

    this.execute = function(codestring){

        // here some code sanitizing, please

        with (this.scope) {
            with (window) {
                eval(codestring);
            }
        }
    };
}

因此，我可以实例化Sandbox并使用其execute（）来运行代码。此外，eval'd代码中的所有新声明变量最终都将绑定到execute（）作用域，因此不会出现冲突名称或乱码现有代码。

虽然全局对象仍然是可访问的，但沙盒代码中未知的那些对象必须在Sandbox :: scope对象中定义为代理。

希望这适合你。

Answer 15

您可以将用户代码包装在一个重新定义禁止对象作为参数的函数中 - 这些函数在调用时将为undefined：

(function (alert) {

alert ("uh oh!"); // User code

}) ();

当然，聪明的攻击者可以通过检查Javascript DOM并找到包含对窗口引用的非重写对象来解决这个问题。

另一个想法是使用jslint之类的工具扫描用户的代码。确保它设置为没有预设变量（或：只需要你想要的变量），然后如果设置或访问了任何全局变量，则不要让用户的脚本被使用。同样，可能容易走DOM - 用户可以使用文字构造的对象可能具有对窗口对象的隐式引用，可以访问该窗口对象以逃避沙箱。

是否可以在浏览器中运行沙盒JavaScript？

15 个答案: