在ReactJS中输入清理

Question

我正在使用ReactJS做一个简单的聊天应用程序.有人可以帮我清理输入.只有一个输入文本框可以发送聊天消息.如何消毒呢？

<input type="text"
              className="chat"
              value={this.state.name}
            />

基于文档HTML默认情况下转义为html.够了吗？我是否需要添加任何其他清理方法.如果是,请告诉我怎么做？

Answer 1

默认情况下它已经过清理,除非你使用的是dangerouslySetInnerHTML,否则你不需要清理方法.

https://facebook.github.io/react/docs/introducing-jsx.html#jsx-prevents-injection-attacks"默认情况下,React DOM会在渲染之前转义JSX中嵌入的任何值.因此它确保您永远不会注入未在应用程序中明确写入的任何内容.在呈现之前,所有内容都会转换为字符串.这有助于防止XSS(跨站点脚本)攻击. (8认同)

Answer 2

JSX 表达式 {} 在渲染之前自动处理 HTML 编码，这意味着即使您不清理输入，您的网页也是 XSS 安全的。

请参考react站点中的此DOC：jsx-prevents-injection-attacks

注意：如果您希望用户允许输入 HTML..，那么您需要输入 Sanitisation，并且必须使用危险的SetInnerHTML，如上面帖子中提到的@dgrijuela。