React 安全性：状态操纵

Question

我正在开发一个 React 项目，并且喜欢它的动态性。但是，在处理动态安全功能时 - 在我的例子中，Google reCAPTCHA，我非常担心用户操纵我的状态和属性的可能性。

例如，我是这样处理 reCAPTCHA 的：

class Create extends Component {
  constructor() {
    super();
    this.onRECAPTCHA = this.onRECAPTCHA.bind(this);
    this.state = {captcha: false}
    // ...
  }

  onRECAPTCHA(value) {
    if (value == null) {
      this.setState({captcha: false})
    }
    this.setState({captcha: true})
  }
}

我有一个按钮 onClick 的处理程序，在函数中，它在继续之前针对 this.state.captcha 进行测试。它按预期工作，但我偶然发现了 react-dev-tools 并发现我能够手动操作我的验证码状态！我是不是明显遗漏了什么，或者我不应该将验证码设置为 state/property？这与我设置的其他几个 states/props 有关。我所有的验证都是这样存储的。

Answer 1

最终，您需要获得授权才能在安全环境中进行，而浏览器不是那个地方。例如，如果您要保护表单提交，则由您决定是否让服务器端代码处理提交以验证验证码响应是否符合预期。只要您不将客户端状态用作 validation/authorization.

的唯一来源，那么客户端状态可以被操纵这一事实并不重要。

React 安全性：状态操纵

React security: state manipulation

node.js

reactjs

security

recaptcha

states