0

我有一种情况，我将外部 HTML 加载到网页上的 WYSIWYG 编辑器中。外部 HTML 来自受信任的来源，包括<div>来自多个不同页面的两个特定标签之间的内容。

我的问题是某些页面包含内联 javascript 事件处理程序。所以当我在 WYSIWYG 编辑器中工作时，某些事件会导致这个 js 的执行。

大多数情况下，它除了在控制台中填满错误说之外什么都不做... is not defined，这可能就是它的全部，这不会是一个问题。但是，它仍然很乱，我不知道是否没有某个页面可以执行类似的操作alert(...)，这可能会变得非常烦人。代码都是可信的，但与预期的上下文分离，它可能会产生不良结果。

我想找到一种方法来全局阻止这种执行，最好不修改内联脚本。我可以做一些事情，比如附加=false;到每个处理程序，但是我必须检查所有传入的元素，即使使用正则表达式，这也会降低性能。此外，在将编辑后的 ​​HTML 提交回服务器之前，我必须将其删除，这似乎是一个很大的痛苦，而且很难完美地完成。

有没有办法阻止这个在线代码在这个特定的上下文中执行？

4

2 回答 2

1

根据您尝试支持的浏览器，您可以签出“内容安全策略”标题。查看http://caniuse.com/contentsecuritypolicy了解有关浏览器支持的详细信息。

如果您的目标浏览器在列表中，CSP 可以完全满足您的需求。默认情况下它将禁用事件处理程序。除了阻塞事件处理程序之外，它还将阻止页面上嵌入的任何代码的执行。因此，您需要将所有 js 代码（如果存在于 html 页面上）移动到单独的 js 中，在安全列表中指定该文件名并从那里加载您的 js。

CSP 设置为 Http 标头，但使用新规范也可以使用元标记进行设置。结帐https://dvcs.w3.org/hg/content-security-policy/raw-file/tip/csp-specification.dev.html#html-meta-element--experimental。

对于支持 WebKit 的浏览器（Chrome/Safari），类似的东西会限制来自任何外部源的负载。您可以将接受的来源列表添加到列表中，并探索适合您的方法。

对于 Firefox，虽然它在规范中有，但我认为元标记尚不支持。 https://developer.mozilla.org/en-US/docs/Security/CSP/Introducing_Content_Security_Policy。

总而言之，只要您可以为托管网页的 Web 服务器设置标头（除非您只想要 Chrome/Safari 支持），并且您的目标浏览器支持 CSP，您就可以试一试。

于 2013-08-16T13:57:53.970 回答
0

我从sitepoint forum复制了这个，一个类似于你的问题。这需要一种将 div 从父级中拉出并重新打开的方法。如果这是您想要的，这里是示例代码：

var div = document.getElementById('div');
var nextSibling = div.nextSibling;
var parent = div.parentNode;
parent.removeChild(div);
function reCreateElement() {
    if (nextSibling) {
        parent.insertBefore(div, nextSibling);
    } else {
        parent.appendChild(div);
    }
}
setTimeout(reCreateElement, 100);

// Below is the stuff we don't want to run!
document.getElementById('div').onclick = function() {
 alert('CLICKED!');
}
于 2013-08-16T12:40:03.740 回答