在 iframe/div 中禁用 JavaScript
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/3689455/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Disable JavaScript in iframe/div
提问by Azmisov
I am making a small HTML page editor. The editor loads a file into an iframe. From there, it could add, modify, or delete the elements on the page with new attributes, styles, etc. The problem with this, is that JavaScript (and/or other programming languages) can completely modify the page when it loads, before you start editing the elements. So when you save, it won't save the original markup, but the modified page + your changes.
我正在制作一个小的 HTML 页面编辑器。编辑器将文件加载到 iframe 中。从那里，它可以添加、修改或删除页面上具有新属性、样式等的元素。这样做的问题是 JavaScript（和/或其他编程语言）可以在页面加载时完全修改页面，之前你开始编辑元素。因此，当您保存时，它不会保存原始标记，而是保存修改后的页面 + 您的更改。
So, I need some way to disable the JavaScript on the iframe, or somehow remove all the JavaScript before the JavaScript starts modifying the page. (I figure I'll have to end up parsing the file for PHP, but that shouldn't be too hard) I considered writing a script to loop through all the elements, removing any tags, onclick's, onfocus's, onmouseover's, etc. But that would be a real pain.
因此，我需要某种方法来禁用 iframe 上的 JavaScript，或者在 JavaScript 开始修改页面之前以某种方式删除所有 JavaScript。（我想我最终必须为 PHP 解析文件，但这应该不会太难）我考虑编写一个脚本来循环遍历所有元素，删除任何标签、onclick、onfocus、onmouseover 等。但是那将是一种真正的痛苦。
Does anyone know of an easier way to get rid of JavaScript from running inside an iframe?
有谁知道一种更简单的方法来摆脱在 iframe 中运行的 JavaScript？
UPDATE: unless I've missed something, I believe there is no way to simply 'disable JavaScript.' Please correct me if I'm wrong. But, I guess the only way to do it would be to parse out any script tags and JavaScript events (click, mouseover, etc) from a requested page string.
更新：除非我错过了什么，我相信没有办法简单地“禁用 JavaScript”。如果我错了，请纠正我。但是，我想唯一的方法是从请求的页面字符串中解析出任何脚本标记和 JavaScript 事件（单击、鼠标悬停等）。
采纳答案by Emanuele Del Grande
You can try the same solution adopted by CKEditor, of which you have a demo here.
By switching from RTE mode to view source mode, you can enter some JavaScript and see the result, which is a replacement of the JS node in a safely encoded string.
If you are in view sourcemode, by entering some JS line like:
您可以尝试 CKEditor 采用的相同解决方案，您可以在此处进行演示。
通过从RTE模式切换到查看源码模式，你可以输入一些JavaScript并查看结果，这是一个安全编码字符串中的JS节点的替换。
如果您处于查看源代码模式，请输入一些 JS 行，例如：
<script type="text/javascript">
// comment
alert('Ciao');
</script>
you will see it rendered this way when going back to rich text editormode:
返回富文本编辑器模式时，您将看到它以这种方式呈现：
<!--{cke_protected}%3Cscript%20type%3D%22text%2Fjavascript%22%3E%0D%0A%2F%2F%20comment%0D%0Aalert('Ciao')%3B%0D%0A%3C%2Fscript%3E-->
I think it is one of the easiest and effective way, since the RegExp to parse JS nodes is not complex.
An example:
我认为这是最简单有效的方法之一，因为解析 JS 节点的 RegExp 并不复杂。
一个例子：
var pattern = /<script(\s+(\w+\s*=\s*("|').*?)\s*)*\s*(\/>|>.*?<\/script\s*>)/;
var match = HTMLString.match(pattern); // array containing the occurrences found
(Of course, to replace the script node you should use the replace() method).
（当然，要替换脚本节点，您应该使用 replace() 方法）。
Regards.
问候。
回答by AlexanderB
HTML5 introduces the sandboxattributeon the iframe that, if empty, disables JavaScript loading and execution.
HTML5在 iframe 上引入了一个sandbox属性，如果为空，则禁用 JavaScript 加载和执行。
回答by Joel Martinez
Yes, your update is correct. You mustassume that any input you receive from the user may contain malicious elements. Thus, you mustvalidate on the server before accepting their input.
是的，您的更新是正确的。您必须假设您从用户那里收到的任何输入都可能包含恶意元素。因此，您必须在接受他们的输入之前在服务器上进行验证。
回答by Senthil Vel
You can set Content Security Policyas script-src 'self'in header. CSP will block any scripts other than from our own website. This way we can prevent any scripts from iframe changing the elements in our page.
您可以在标题中将内容安全策略设置为script-src 'self'。CSP 将阻止来自我们自己网站以外的任何脚本。通过这种方式，我们可以防止任何脚本通过 iframe 更改我们页面中的元素。
You can get more information from here http://www.html5rocks.com/en/tutorials/security/content-security-policy/
您可以从这里获得更多信息http://www.html5rocks.com/en/tutorials/security/content-security-policy/
