首页 > 解决方案 > 使用“sanitize-html”npm 包清理 HTML 的问题

问题描述

根据文档,我尝试了以下代码

const dirty = '<div>Content</div>';
const clean = sanitizeHtml(dirty);

clean 的预期输出应该是“Content”,但这会返回“clean”,从带有 div 标签的脏中返回相同的值

标签: javascriptreactjs

解决方案


如果您打算将值重新插入到 innerHTML 中,可能是为了修改语句但确保用户不会在您的聊天框中插入 HTML?

let received_message ="<div>this should break chat boxes</div>";
let message = received_message.replace(/</g, '&lt;').replace(/>/g, '&gt;');

document.querySelector("#hacked").innerHTML += received_message;
document.querySelector("#nothacked").innerHTML += message;
<div id="hacked"></div>
<div id="nothacked"></div>

如果要担心这样的输入,这将剥离 < 和 > 并关闭 HTML 中的所有 HTML、Javascript 和其他形式的注入。


推荐阅读