为什么React.js的API警告不要插入原始HTML？

Question

从教程

但是有一个问题!我们在浏览器中呈现的评论如下:" <p>This is <em>another</em> comment</p>".我们希望这些标签实际呈现为HTML.

这是React保护您免受XSS攻击.有办法绕过它,但框架警告你不要使用它:

...

<span dangerouslySetInnerHTML={{__html: rawMarkup}} />

这是一个特殊的API,故意插入原始HTML很困难,但对于Showdown,我们将利用这个后门.

请记住:通过使用此功能,您依靠Showdown是安全的.

因此存在用于插入原始HTML的API,但方法名称和文档都对其发出警告.使用它是否安全？例如,我有一个聊天应用程序,它接受Markdown注释并将它们转换为HTML字符串.Mark片段转换器在服务器上生成HTML片段.我相信转换器,但我不确定用户是否有任何方法可以精心设计Markdown以利用XSS.还有什么我应该做的,以确保这是安全的吗？

Answer 1

大多数Markdown处理器(我也相信Showdown)允许编写器使用内联HTML.例如,用户可能输入:

This is _markdown_ with a <marquee>ghost from the past</marquee>. Or even **worse**:
<script>
  alert("spam");
</script>

因此,您应该有一个标签白名单,并在从markdown转换为html后删除所有其他标签.只有这样才能使用恰当的名字dangerouslySetInnerHTML.

请注意,这也是Stackoverflow的功能.上面的Markdown呈现如下(没有你的脸上发出警报):

这是过去鬼魂的降价.甚至更糟:

警报( "垃圾邮件");