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。
我正在学习这两个教程,
并在 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。