javascript - 使用 dangerouslySetInnerHtml 有什么风险,是什么阻止了某人通过浏览器删除 santization?

标签 javascript html reactjs frontend browser-security

我正在使用 dangerouslySetInnerHtml 将 mustache 模板中的 html 渲染到 React 中。我正在阅读 the security concerns这对我来说是新的。

我的用例是我有一些包含 svg 的 html。这是静态的,不会从任何数据库中提取。我只想渲染这个。

我读到您应该“清理”html。此处给出的示例提供了人们在清理 html 时使用的库,然后在 dangerouslySetInnerHtml 属性中使用经过清理的变体。

然而,是什么阻止了某人简单地进入 JS 并通过 devtools 或其他东西编辑 html,以便清理不会发生。

我没有太多关于此的上下文,所以很抱歉我不能用一个例子来更具体。

我已经尝试了很多 html 到 React 的解析器。得出的结论是我需要危险地使用 SetInnerHtml

最佳答案

此 HTML 代码来自用户 时,您应该对 HTML 进行“清理”,就像您输入用户可以将 HTML 代码提交到您的服务器,然后在其他用户的浏览器上显示一样。

“然而,是什么阻止了某人简单地进入 JS 并通过开发工具或其他工具编辑 html,以便清理不会发生。” 这似乎不正确,抱歉。原因是危险的 HTML 代码只会影响查看它的用户。如果他们在浏览器中编辑 JS 文件,那是没有意义的,因为他们是自己的受害者。

阅读更多关于 https://en.wikipedia.org/wiki/Cross-site_scripting 的信息(HTML 清理用于什么)

关于javascript - 使用 dangerouslySetInnerHtml 有什么风险,是什么阻止了某人通过浏览器删除 santization?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55498108/

相关文章:

javascript - 将 Unity WebGL 项目导入 Angular2 组件

javascript - 在 Jquery 之后更新/更改表格单元格文本

javascript - 在 React.js 中实现阅读更多链接

javascript - 如果标签已经存在,如何防止插入标签?

css - iOS 15 Safari CSS 中新的安全区域插入方法是什么?

reactjs - 如何切换 antd Typography.Paragraph 省略号

javascript - 按下或单击时功能不起作用

javascript - Angular 2 ngModel 返回 [object]

javascript - 未设置 PHP GET 变量

javascript - 显示网页时使用了两个或多个 CSS 样式