如何在允许格式化的 JavaScript 编辑器中进行清理

Posted 2023-02-19

【中文标题】如何在允许格式化的 JavaScript 编辑器中进行清理

【英文标题】：How to handle sanitizing in JavaScript editors that allow formatting

【发布时间】：2018-04-17 11:17:16

【问题描述】：

现在，像 Medium 这样的许多编辑器都提供格式设置。从我在 DOM 中看到的内容来看，它只是添加了 html。但是如何在不丢失用户应用的格式的情况下清理这种输入呢？

例如点击粗体添加：

<strong class="markup--strong markup--p-strong">text</strong>

但如果用户自己输入，您不会想要呈现。那有什么不同呢？如果您使用 markdown 进行样式设置但也不让用户输入他们自己的 markdown 而是使其只能通过浏览器访问，那也会有所不同吗？

我能想到的一种方法是转义每个 HTML 特殊字符，但这似乎很奇怪。据我所知，您仅在输出内容时对其进行消毒

【问题讨论】：

你必须找到来源——特别是你指的媒介？使用开发工具查找 JS 中被吐出的位置然后偏转它

【参考方案1】：

您应该使用服务器端消毒剂，正如 Vipin 所说，因为客户端验证很容易被篡改。 OWASP（开放式 Web 应用程序安全项目）有一些您可以使用的指南和清理程序，例如 java-html-sanitizer。

有关该概念的一般简介，请阅读消毒部分下的https://www.owasp.org/index.php/Data_Validation。

【参考方案2】：

您可以将白名单中的元素替换为其他字符，例如：

<strong.*> becomes |strong|

然后您删除所有其他 HTML。注意 onmouseover="alert(1)" 所以要保持简单。

在呈现用户输入时也要小心。不要只是将其添加为代码。而是解析它并使用 javascript 创建元素。永远不要使用 innerHTML，但一定要使用 .innerText 和 document.createElement()。