动态沙箱内联JavaScript的最佳方法是什么？

Question

我有一个WordPress插件,可以使用AJAX加载页面,并确保与其他插件和"小部件"的兼容性.

截至目前,我使用以下代码来评估要更新的内容块中的所有内联JS:

  function do_JS(e){
        var Reg = '(?:<script.*?>)((\n|.)*?)(?:</script>)';
        var match    = new RegExp(Reg, 'img');
        var scripts  = e.innerHTML.match(match);
        var doc = document.write;
        document.write = function(p){ e.innerHTML = e.innerHTML.replace(scripts[s],p)};
        if(scripts) {
            for(var s = 0; s < scripts.length; s++) {
                var js = '';
                var match = new RegExp(Reg, 'im');
                js = scripts[s].match(match)[1];
                js = js.replace('<!--','');
                js = js.replace('-->','');
                eval('try{'+js+'}catch(e){}');
            }
        }
        document.write = doc;
    }

我希望能够更好地沙化JS,以便最大限度地减少冲突的风险.我的一个想法是动态创建<iframe>并在其中运行JS,但我希望有更好的方法来确保兼容性和增强安全性.

Answer 1

很可能这不会为您提供所需的内容，但是如何将脚本文本包装在函数或自执行函数文字中(function(){/*...*/})()。

var strEval =  'try{';
strEval += 'widget[' + intWidgetNumber + '] = (function(){';
strEval += js;
strEval += '})();';
strEval += '}catch(e){}';

这比直接eval评估提供了更多的保护，并将代码保留在同一文档中。缺点是，如果您导入的代码对于全局变量来说是混乱的（这可能就是您问这个确切问题的原因），您仍然可以让他们的代码践踏其他代码。如果他们使用该this关键字，他们的代码可能无法按预期工作。但这至少会将正确声明的变量和函数声明保留在封装范围内。

我经常使用第三方代码（大多是写得非常非常糟糕的广告代码），我发现最好的解决方案是将您的网站代码封装在一个冗长且独特的命名空间中（mySiteUtils、mySiteGames 等或 com）。 .mysite.utils、com.mysite.games 等）。如果广告代理决定放入与您的确切命名空间相匹配的代码，他们将破坏您的页面，但到目前为止，这种情况从未发生过。