在 iframe/div 中禁用 JavaScript

Question

我正在制作一个小的 HTML 页面编辑器。 编辑器将文件加载到 iframe 中。 从那里，它可以添加、修改或删除页面上具有新属性、样式等的元素。这样做的问题是 JavaScript（和/或其他编程语言）可以在页面加载时完全修改页面，然后你开始编辑元素。 因此，当您保存时，它不会保存原始标记，而是保存修改后的页面 + 您的更改。

所以，我需要一些方法来禁用 iframe 上的 JavaScript，或者在 JavaScript 开始修改页面之前以某种方式删除所有 JavaScript。 （我想我最终必须为 PHP 解析文件，但这应该不会太难）我考虑编写一个脚本来遍历所有元素，删除任何标签、onclick、onfocus、onmouseover 等。但是那将是一种真正的痛苦。

有谁知道一种更简单的方法来摆脱在 iframe 中运行的 JavaScript？

更新：除非我错过了什么，我相信没有办法简单地“禁用 JavaScript”。 如果我错了，请纠正我。 但是，我想唯一的方法是从请求的页面字符串中解析出任何脚本标记和 JavaScript 事件（单击、鼠标悬停等）。

Answer 1

HTML5 在 iframe 上引入了sandbox属性，如果为空，则禁用 JavaScript 加载和执行。

Answer 2

是的，您的更新是正确的。 您必须假设您从用户那里收到的任何输入都可能包含恶意元素。 因此，您必须在接受他们的输入之前在服务器上进行验证。

Answer 3

您可以尝试 CKEditor 采用的相同解决方案，您可以在此处进行演示。
通过从 RTE 模式切换到查看源模式，可以输入一些 JavaScript 并查看结果，这是一个安全编码字符串中的 JS 节点的替换。
如果您处于查看源代码模式，请输入一些 JS 行，例如：

<script type="text/javascript">
// comment
alert('Ciao');
</script>

返回富文本编辑器模式时，您将看到它以这种方式呈现：

<!--{cke_protected}%3Cscript%20type%3D%22text%2Fjavascript%22%3E%0D%0A%2F%2F%20comment%0D%0Aalert('Ciao')%3B%0D%0A%3C%2Fscript%3E-->

我认为这是最简单有效的方法之一，因为解析 JS 节点的 RegExp 并不复杂。
一个例子：

var pattern = /<script(\s+(\w+\s*=\s*("|').*?\3)\s*)*\s*(\/>|>.*?<\/script\s*>)/;
var match = HTMLString.match(pattern); // array containing the occurrences found

（当然，要替换脚本节点，您应该使用 replace() 方法）。

问候。

Answer 4

您可以在标题中将内容安全策略设置为script-src 'self' 。 CSP 将阻止来自我们自己网站以外的任何脚本。 通过这种方式，我们可以防止任何脚本通过 iframe 更改我们页面中的元素。

您可以从这里获得更多信息http://www.html5rocks.com/en/tutorials/security/content-security-policy/