Rails 不生成真实性令牌

Rails does not generate an authenticity token

我正在学习这两个教程,

并在 Rails 中实现了一个简单的评论系统。但是,我在处理提交时遇到了问题。我实现了一个简单的 AJAX POST 请求来发送我的表单数据(作为状态)。它看起来像这样:

var CommentForm = React.createClass({
    handleChange: function(e) {
    var name, obj;
    name = e.target.name;
    return this.setState((
      obj = {},
      obj["" + name] = e.target.value,
      obj
    ));
  },
    handleSubmit: function(e) {
        e.preventDefault();
        var author = React.findDOMNode(this.refs.author).value.trim();
        var text   = React.findDOMNode(this.refs.text).value.trim();
        if(!text || !author) {
            return;
        }
        $.post(this.props.postUrl, {comment: this.state}, null, "application/json");
        React.findDOMNode(this.refs.author).value = '';
        React.findDOMNode(this.refs.text).value = '';
    },
    render: function() {
        return (
            <form className="commentForm" onSubmit={this.handleSubmit}>
        <input type="text" placeholder="Your name" ref="author" name="author" onChange={this.handleChange} />
        <input type="text" placeholder="Say something..." ref="text" name="text" onChange={this.handleChange} />
        <input type="submit" value="Post" />
      </form>
        );
    }
});

当我检查控制台时,它似乎正在传递到正确的路由和正确的参数,除了没有 authenticity_token 参数。这是控制台内容的屏幕截图。

在我提供的第一个 link 中,据说 jquery_ujs 处理生成真实性令牌并将其传递给 Ajax POST。但是,我的情况并非如此。我错过了什么?

编辑: 我有一些答案可以解决我的问题。但是,我仍然很好奇我的代码和本教程中的代码有何不同?

这是因为您的 render 方法中缺少传递 authenticity_token 的方法。您要么禁用真实性检查( 推荐),要么使用真实性令牌交付呈现的表单。

在这种情况下,我建议使用 Gon 将控制器变量干净地传递给 JS:https://github.com/gazay/gon

安装时间:

在你的控制器方法中:

gon.authenticity_token = form_authenticity_token

在你的反应中 class:

<form className="commentForm" onSubmit={this.handleSubmit}>
    <input type="hidden" name="authenticity_token" value={gon.authenticity_token}  />
    <input type="text" placeholder="Your name" ref="author" name="author" onChange={this.handleChange} />
    <input type="text" placeholder="Say something..." ref="text" name="text" onChange={this.handleChange} />
    <input type="submit" value="Post" />
</form>

您可以将 authenticity_token 属性添加到您的 AJAX POST:

您可以替换此行:

$.post(this.props.postUrl, {comment: this.state}, null, "application/json");

有了这个:

$.post(this.props.postUrl, {
    comment: this.state,
    authenticity_token: $('meta[name=csrf-token]').attr('content')
  }, null, "application/json");

已解决。 删除了行

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

来自 application.html.erb。事实证明,它在发出 AJAX 请求时正在跟踪 jquery_rails。