允许用户添加 html 格式的注释
我们希望允许 Web 应用程序的用户留下 html 格式的注释。
在客户端，我们为他们提供 ckeditor [http://ckeditor.com/]，这是一个生成 html 的 wisywig 编辑器，然后通过表单提交到服务器
然后我们想要显示用户创建的注释，使用与他们提交的格式完全相同的格式
我的担忧是：
抛开攻击和恶意意图不谈，我如何在网站上显示时封装注释，以便 一个。它们不会继承页面其余部分的设计 b.它们不会影响页面的其余部分，例如意外打开和不关闭标签，或者在没有打开的情况下关闭。
恶意代码注入攻击
目前，第一个更为重要，因为它是我们客户的内部产品，不向公众开放。但安全评论也非常受欢迎，
我考虑的可能解决方案是：
- 理想情况下，我寻找一种方法来封装这部分用户 html，例如：在该区域内，我显示您提交的内容（呈现的，不是源代码），您不能影响页面其他部分的代码，也不受其影响
具体来说，我们考虑在 iframe 内显示注释。
- 其他自然方向是处理解析插入的内容并剥离内容。
欢迎任何输入，主要是：
如果可以的话，我如何“封装”插入的内容？
关于 iframe 方向的任何评论
我是否必须解析内容？我绝对必须删除什么？
We want to allow the users of our web application, to leave notes formatted with html.
On client side we are providing them with ckeditor [http://ckeditor.com/] which is a wisywig editor that generates html, that is then submitted to the server via a form
We then want to display the notes created by the users, with exactly the same formatting as they submitted them
My concerns are:
Putting attacks and bad intentions aside, how can I encapsulate the note when displayed on the site, so that
a. They don't inherit the design from the rest of the page
b. They don't influence the rest of the page, for example by opening and not closing a tag accidentally, or closing without opening.Malicious code injection attacks
At the moment, the first is much more important, as it's an in house product for our clients, and is not open to the wide public. But security comments are very wellcome as well
Possible solutions that I consider are:
- Ideally, I look for a way to encapsulate this pieces of user html, like : inside this area I show what you submitted (rendered, not source), you cannot influence and are not influenced by the code on other parts of the page
Specifically, we thought of displaying the notes inside iframes.
- Other natural direction is dealing with parsing the inserted contents, and stripping out stuff.
Any inputs are welcome, and mainly:
How can I "encapsulate" the inserted contents, if I can?
Any comments on the iframe direction
Do I have to parse the contents anyway? What do I absolutely have to strip out?
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
如果可以的话，我怎样才能“封装”插入的内容？
事实是，除非你“修复”他们的代码（通过某种检查），否则你会遇到问题（比如损坏的 div 等）。我不明白如何封装 HTML FROM HTML。然而，我只会让他们输入粗体、斜体、居中等内容；
对 iframe 方向的任何评论
就我个人而言，我不会走这条路，为了安全而采取新的蠕虫方式，而不是一种“干净”的方式。
我是否必须解析内容？我绝对必须去掉什么？
是的，不要偷懒，一些开发人员总是说“好吧，我不需要它，它是内部的”，然后它就变成了一个外部的东西，到那时它就太大了只有完全重写才能将其纠正，并且它会一直持续下去，直到有什么东西被破坏，然后狗屎撞到了风扇，大老板大喊为什么这还没有完成。长话短说。
是的，您必须解析/验证/检查所有输入，无论是内部还是外部。除此之外的任何事情都是懒惰的。
最后，我将使用像这里这样的编辑器来完成它，它只允许某些类型的选择性格式化。毕竟，损坏的
不会破坏整个布局，会...How can I "encapsulate" the inserted contents, if I can?
The truth is unless you 'fix' their code (via some kind of check) you will get issues (think broken divs, etc). I don't see how you can encapsulate HTML FROM HTML. I would however only let them put in content like bold, italicize, center, etc;
Any comments on the iframe direction
Personally I wouldn't go that route, new can of worms for security and not a 'clean' way of doing this.
Do I have to parse the contents anyway? What do I absolutely have to strip out?
Yes don't be lazy, some devs always say "well I dont need it, its internal" and then it becomes an external thing, and at that point its so big that ONLY a full re-write will set it right, and it keeps chugging along until something is broken, then shit hits the fan and the big boss cries out why hasn't this been done. Long story short.
Yes you have to parse / validate / check all your input, wether internal or external. Anything other than that is just lazy.
In closing I would do it by using an editor like here on SO, which only allows some types of selective formatting. After all a broken
<b>will not kill your whole layout, a<div>will...Markdown 格式
您可以使用与此站点 (StackOverflow) 在其用户生成的内容（问题、答案、评论）中使用的完全相同类型的中间解决方案。
它不是可以取代代码编辑器等所见即所得解决方案的完整解决方案，但它正是通常的用户生成内容所需要的。它甚至允许您包含图像。
如需完整指南：
https://www.markdownguide.org/cheat-sheet
Markdown formatting
You could use exactly the same type of intermediary solution that this site (StackOverflow) uses in it's user-generated-content (questions, answers, comments).
It's not the complete solution that could replace WYSIWYG solutions like the code editor, but it's just what a usual user-generated-content woudl require. It even allows you to include images.
For a complete guide:
https://www.markdownguide.org/cheat-sheet