- xml - AJAX/Jquery XML 解析
- 具有多重继承的 XML 模式
- .net - 枚举序列化 Json 与 XML
- XML 简单类型、简单内容、复杂类型、复杂内容
关于如何对 WMD 编辑器生成的 Markdown 进行服务器端清理以确保生成的 HTML 不包含恶意脚本,如下所示:
<img onload="alert('haha');"
src="http://www.google.com/intl/en_ALL/images/srpr/logo1w.png" />
但我也没有找到堵住客户端漏洞的好方法。当然,客户端验证不能替代服务器上的清理验证,因为任何人都可以假装是客户端并向您发送令人讨厌的 Markdown。而且,如果您在服务器上删除 HTML,攻击者将无法保存错误的 HTML,这样其他人以后就无法看到它,并且他们的 cookie 被盗或 session 被错误的脚本劫持。因此,有一个有效的案例表明,在 WMD 预览 Pane 中执行无脚本规则可能也不值得。
但想象一下,攻击者找到了一种将恶意 Markdown 放到服务器上的方法(例如,来自另一个站点的受损提要,或者在修复 XSS 错误之前添加的内容)。在将 markdown 翻译成 HTML 时应用的服务器端白名单通常会阻止向用户显示该错误的 Markdown。但是,如果攻击者可以让某人编辑页面(例如,通过发布另一个条目说恶意条目有一个损坏的链接并要求某人修复它),那么任何编辑该页面的人都会劫持他们的 cookie。诚然,这是一个极端案例,但它仍然值得防御。
此外,允许客户端预览窗口允许与您的服务器允许的不同的 HTML 可能不是一个好主意。
Stack Overflow 团队通过更改 WMD 填补了这个漏洞。他们是怎么做到的?
[注意:我已经解决了这个问题,但它需要一些棘手的 JavaScript 调试,所以我在这里回答我自己的问题以帮助可能想要做同样事情的其他人]。
最佳答案
一个可能的修复是在 wmd.js 中的 pushPreviewHtml()
方法中。这是来自 Stack Overflow version of WMD on GitHub 的原始代码:
if (wmd.panels.preview) {
wmd.panels.preview.innerHTML = text;
}
您可以将其替换为一些清理代码。这是 Stack Overflow 使用的代码的改编版 in response to this post ,它限制为标签白名单,对于 IMG 和 A 元素,限制为属性白名单(并且也以特定顺序!)。请参阅元堆栈溢出帖子 What HTML tags are allowed on Stack Overflow, Server Fault, and Super User? 有关白名单的更多信息。
注意:这段代码当然可以改进,例如允许以任何顺序列入白名单的属性。它还不允许 mailto: URL,这在 Internet 站点上可能是一件好事,但在您自己的 Intranet 站点上它可能不是最好的方法。
if (wmd.panels.preview) {
// Original WMD code allowed JavaScript injection, like this:
// <img src="http://www.google.com/intl/en_ALL/images/srpr/logo1w.png" onload="alert('haha');"/>
// Now, we first ensure elements (and attributes of IMG and A elements) are in a whitelist,
// and if not in whitelist, replace with blanks in preview to prevent XSS attacks
// when editing malicious Markdown.
var okTags = /^(<\/?(b|blockquote|code|del|dd|dl|dt|em|h1|h2|h3|i|kbd|li|ol|p|pre|s|sup|sub|strong|strike|ul)>|<(br|hr)\s?\/?>)$/i;
var okLinks = /^(<a\shref="(\#\d+|(https?|ftp):\/\/[-A-Za-z0-9+&@#\/%?=~_|!:,.;\(\)]+)"(\stitle="[^"<>]+")?\s?>|<\/a>)$/i;
var okImg = /^(<img\ssrc="https?:(\/\/[-A-Za-z0-9+&@#\/%?=~_|!:,.;\(\)]+)"(\swidth="\d{1,3}")?(\sheight="\d{1,3}")?(\salt="[^"<>]*")?(\stitle="[^"<>]*")?\s?\/?>)$/i;
text = text.replace(/<[^<>]*>?/gi, function (tag) {
return (tag.match(okTags) || tag.match(okLinks) || tag.match(okImg)) ? tag : ""
})
wmd.panels.preview.innerHTML = text; // Original code
}
另请注意,此修复不在 Stack Overflow version of WMD on GitHub 中-- 很明显,更改是稍后进行的,并没有重新 checkin GitHub。
更新:为了避免破坏在您输入 URL 时自动创建超链接的功能,您还需要对 showdown.js 进行更改,如下所示:
原代码:
var _DoAutoLinks = function(text) {
text = text.replace(/<((https?|ftp|dict):[^'">\s]+)>/gi,"<a href=\"$1\">$1</a>");
// Email addresses: <address@domain.foo>
/*
text = text.replace(/
<
(?:mailto:)?
(
[-.\w]+
\@
[-a-z0-9]+(\.[-a-z0-9]+)*\.[a-z]+
)
>
/gi, _DoAutoLinks_callback());
*/
text = text.replace(/<(?:mailto:)?([-.\w]+\@[-a-z0-9]+(\.[-a-z0-9]+)*\.[a-z]+)>/gi,
function(wholeMatch,m1) {
return _EncodeEmailAddress( _UnescapeSpecialChars(m1) );
}
);
return text;
}
固定代码:
var _DoAutoLinks = function(text) {
// use simplified format for links, to enable whitelisting link attributes
text = text.replace(/(^|\s)(https?|ftp)(:\/\/[-A-Z0-9+&@#\/%?=~_|\[\]\(\)!:,\.;]*[-A-Z0-9+&@#\/%=~_|\[\]])($|\W)/gi, "$1<$2$3>$4");
text = text.replace(/<((https?|ftp):[^'">\s]+)>/gi, '<a href="$1">$1</a>');
return text;
}
关于javascript - 将 WMD 编辑器的预览 HTML 与服务器端 HTML 验证对齐(例如,没有嵌入的 JavaScript 代码),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/2837593/
我想像 wordpress 的 css 管理器一样为我的网站制作 css 管理器。我想在 textarea 中打开 css 文件,这样我就可以编辑它,而不是在按下提交按钮后,应该保存 css 文件中的
我不知道这是一个有效的问题。我见过大多数插件和对话框定义的 CKEditor 示例都使用变量“editor”。我想知道它是什么以及它的值来自哪里。 例如 CKEDITOR.plugins.add( '
如果你希望极认真地学习和使用 XML,那么一定想要找一款称手的 XML 编辑器 XML 是基于文本的 XML是基于文本的标记语言 XML可被类似记事本这样的简单的文本编辑器来创建和编辑 不过在
有没有人成功地将 Summernote 编辑器与 Meteor 一起使用? 见 http://hackerwins.github.io/summernote/ 我在我的模板中包含了以下 div:
就目前而言,这个问题不适合我们的问答形式。我们希望答案得到事实、引用或专业知识的支持,但这个问题可能会引起辩论、争论、投票或扩展讨论。如果您觉得这个问题可以改进并可能重新打开,visit the he
如何使文本默认从右向左对齐(p:editor)。 当前使用 primefaces 3.0.M2-SNAPSHOT。现在无法更新到新版本吗? 这是阿拉伯语版本应用程序所必需的。 谢谢 最佳答案 在 we
如何启动或安装 Eclipse XSD 编辑器? 根据this看来它应该开箱即用。我创建了 XMLExamples 项目,当我打开 Catalogue.xsd 时,Eclipse 将其视为文本文件。如
我爱wysihtml5但我找不到任何关于向元素添加类这样简单的文档。 基本上我正在寻找的是一种允许 blockquote 元素有 2 种不同变体的方法: blockquote.pull-leftblo
我真的很想要一个在 Django 中实现文本编辑器的清晰直接的示例,就像提议的 pagedown 或 markdownx 一样。我无法在 Django 2.0 中使用这些解决方案中的任何一个,并且我找
是否有支持 REPL 和大括号匹配的 ClojureCLR 编辑器?我找到了一个将对 ClojureCLR 的支持添加到 Visual Studio 的项目:vsClojure ,但无法构建它。还有其
GWT 的编辑器框架非常好用,它不仅可以用于编辑POJO,还可以用于只读显示。 但是,我并不完全确定进行内联编辑的最佳做法是什么。 假设我有一个 PersonProxy 并且我有一对 Presente
我对 primefaces 编辑器的第一个问题是它不接受来自 Chrome 和资源管理器中的 MS word 文档的文本,但在 Firefox 中工作正常。有没有办法让它直接接受来自 MS word
我使用 Prototype JS 作为主要 JS 库,并且我已将最后一个 RedactorJS 与 jQuery 以无冲突模式集成,但我无法启动如下功能: jQuery('#redactor').re
关闭。这个问题不满足Stack Overflow guidelines .它目前不接受答案。 想改善这个问题吗?更新问题,使其成为 on-topic对于堆栈溢出。 5年前关闭。 Improve thi
我正在 Laravel 项目上使用 redactor 作为文本编辑器。 每当编辑器位于页面上并初始化时,每当我单击任意位置时都会收到此错误。 Uncaught TypeError: $(...).cl
我在带有 jQuery .show("slide") 动画的界面设计中使用tinyMCE 时遇到问题。由于表单的复杂性,它像向导一样被分为多个页面,但它不使用下一步和后退按钮。相反,它使用部分名称
如何制作像 wufoo.com 表单编辑器中那样的拖放式编辑器 最佳答案 通常客户端应用程序是使用某种客户端框架构建的。比较流行的是(排名不分先后): GWT YUI jQuery 首先检查这些内容,
已关闭。此问题旨在寻求有关书籍、工具、软件库等的建议。不符合Stack Overflow guidelines .它目前不接受答案。 我们不允许提问寻求书籍、工具、软件库等的推荐。您可以编辑问题,以
有人建议我使用具有语法错误检查和调试功能的 Javascript 编辑器吗? Eclipse IDE 有可用的插件吗?或者您可以建议最适合错误检查和调试的任何编辑器。 提前致谢。 最佳答案 您可以安装
关闭。这个问题不符合Stack Overflow guidelines .它目前不接受答案。 我们不允许提问寻求书籍、工具、软件库等的推荐。您可以编辑问题,以便用事实和引用来回答。 关闭 7 年前。
我是一名优秀的程序员,十分优秀!