Question

反应：^ 0.14.X

完整性检查 - 在React中构建自定义输入很常见使用ajax并且因为令牌的组件作为状态的一部分传递给客户端我可以想象使用React需要使用表单和隐藏的输入值来传递csrf令牌是一个可以完全跳过的步骤，但是当Github上的EVERYBODY仍在构建使用表单和隐藏输入值的React应用程序时 - 你开始认为必须有一些神奇的原因。

现在我知道表单和隐藏的输入值是建议处理的方式在Node / SPA应用程序......

...但是使用React我没有看到CSRF令牌触及的原因 DOM（我认为它很容易被偷走），而是只是从组件的状态访问并随时传递它提交的内容。

例如，这个从组件传递csrf的登录组件状态（稍后由ajax处理）。

var Login = React.createClass({

  getInitialState: function() {
    return{
      csrf: this.props.csrf,
      email:'',
      password: ''
    }
  },

  onEmailChange: function(event) {
    this.setState({email: event.target.value});
  },

  onPasswordChange: function(event) {
    this.setState({password: event.target.value});
  },

  onSubmit: function() {
    ActionCreators.login(this.state.email, this.state.password,this.state.csrf); 
  },

  render: function(){

    return (

        <div className="login-block">
            <input type="text" placeholder="Email" id="input" onChange={this.onEmailChange}/>
            <input type="password" placeholder="Password" id="input" onChange={this.onPasswordChange}/>
            <button onClick={this.onSubmit}>Submit</button>
        </div>

    )
  }

});

问题：上面的代码在我的应用程序中是否应该考虑使用表单和隐藏的输入值，是否存在某种可操作性？

Answer 1

我不这么认为，我认为这只是SPA之前的暂停。也许实际上对于SPA，理想情况下，您希望在每次状态更改后以某种方式获得新的CSRF令牌，例如AJAX请求或websocket请求，如果您使用的表单未使用，则无法进行刷新。在我们的应用程序中，CSRF令牌实际上是通过EJS模板渲染所写的一些microbenchmark发送的。

React / CSRF：在不使用表单和隐藏输入值的情况下传回CSRF令牌

1 个答案: