noDangerouslySetInnerHtml

JSX and TSX

摘要

¥Summary

规则生效日期：v1.0.0

¥Rule available since: v1.0.0
诊断类别：lint/security/noDangerouslySetInnerHtml

¥Diagnostic Category: lint/security/noDangerouslySetInnerHtml
此规则没有修复方案。

¥This rule doesn’t have a fix.
此规则的默认严重级别为 error。

¥The default severity of this rule is error.
此规则属于以下域：

¥This rule belongs to the following domains:
- react
来源：

¥Sources:
- 与 react/no-danger 相同
  
  ¥Same as react/no-danger

如何配置

¥How to configure

1
{
2
  "linter": {
3
    "rules": {
4
      "security": {
5
        "noDangerouslySetInnerHtml": "error"
6
      }
7
    }
8
  }
9
}

描述

¥Description

防止使用危险的 JSX props

¥Prevent the usage of dangerous JSX props

示例

¥Examples

无效

¥Invalid

1
function createMarkup() {
2
    return { __html: 'child' }
3
}
4
<div dangerouslySetInnerHTML={createMarkup()}></div>

code-block.jsx:4:6 lint/security/noDangerouslySetInnerHtml ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  ✖ Avoid passing content using the dangerouslySetInnerHTML prop.
  
    2 │     return { __html: ‘child’ }
    3 │ }
  > 4 │ <div dangerouslySetInnerHTML={createMarkup()}></div>
      │      ^^^^^^^^^^^^^^^^^^^^^^^
    5 │ 
  
  ⚠ Setting content using code can expose users to cross-site scripting (XSS) attacks

1
React.createElement('div', {
2
    dangerouslySetInnerHTML: { __html: 'child' }
3
});

code-block.js:2:5 lint/security/noDangerouslySetInnerHtml ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  ✖ Avoid passing content using the dangerouslySetInnerHTML prop.
  
    1 │ React.createElement(‘div’, {
  > 2 │     dangerouslySetInnerHTML: { __html: ‘child’ }
      │     ^^^^^^^^^^^^^^^^^^^^^^^
    3 │ });
    4 │ 
  
  ⚠ Setting content using code can expose users to cross-site scripting (XSS) attacks

noDangerouslySetInnerHtml

摘要

如何配置

描述

示例

无效

相关链接