Rails: 加载时限制 POST 请求
Rails: restrict POST request while loading
嗨,对不起,如果标题听起来不太具有描述性,目前我的 rails 应用程序有一个严重的问题,它是一个分类应用程序,因此用户可以创建分类广告,所以问题是当一个用户尝试创建分类广告,有时由于流量大加载几秒钟,有一些不耐烦的用户多次点击表单中的 "Create" 按钮,结果:用户创建了相同的分类广告很多次,我的意思是,当用户在等待时,如果他再次单击创建按钮会创建一个新的 POST 请求,这就是多次创建分类的原因。我不知道如何解决这个问题,有什么想法吗?
更新
我想实施 server-side 解决方案,而不是 front-end,我的意思是有没有办法通过控制器验证它?还是视图本身?谢谢
为提交按钮指定 disable_with 选项。它应该可以部分解决您的问题。
我将拥有处理您的 POST 功能的功能 return 重定向到与带有 "create" 按钮的页面相同的页面,只是按钮处于非活动状态
我遇到过类似的问题...有两种可靠的解决方案可以防止多次提交表单:-
使用 jquery 中的 one 事件处理程序,它只允许触发一次
例如
$("#post_submit_button").one("click", function(){
//run ajax call and use .done and .error notify user
});
其他选项是使用 awesome jqeury.validate js 库来使用实时验证而不提交表单,当所有值都有效时,提交并禁用按钮。
例如
$("form#imageupload").validate({
rules: {
"image[title]": {
required: true,
minlength: 3,
maxlength: 100
},
submitHandler: function(form) {
//disable the button
$('#post_button').attr('disabled','disabled');
var formData = new FormData(form);
$.ajax(
})
.done(function (response) {
if (response.success == 'success') {
//alert('success');
} else {
//alert('fail');
}
}).error(function(data) {
//this will run when no server,or ajax cannot go forward
$('#post_button').removeAttr('disabled');
});
return false; // required to block normal submit since you used ajax
}
我的建议是在所有按钮中使用 data-disabled-with
属性,这对你有用:
<%= f.submit "Submit", data: { disable_with: "Wait please..." } %>
这样,每次单击按钮时,它都会被禁用以防止重复提交,并且还会显示文本 "Wait please..."
如果您在表单中使用客户端验证,请小心。在这种情况下,您必须手动删除 disabled
属性,否则您的按钮将保持禁用状态。
嗨,对不起,如果标题听起来不太具有描述性,目前我的 rails 应用程序有一个严重的问题,它是一个分类应用程序,因此用户可以创建分类广告,所以问题是当一个用户尝试创建分类广告,有时由于流量大加载几秒钟,有一些不耐烦的用户多次点击表单中的 "Create" 按钮,结果:用户创建了相同的分类广告很多次,我的意思是,当用户在等待时,如果他再次单击创建按钮会创建一个新的 POST 请求,这就是多次创建分类的原因。我不知道如何解决这个问题,有什么想法吗?
更新 我想实施 server-side 解决方案,而不是 front-end,我的意思是有没有办法通过控制器验证它?还是视图本身?谢谢
为提交按钮指定 disable_with 选项。它应该可以部分解决您的问题。
我将拥有处理您的 POST 功能的功能 return 重定向到与带有 "create" 按钮的页面相同的页面,只是按钮处于非活动状态
我遇到过类似的问题...有两种可靠的解决方案可以防止多次提交表单:-
使用 jquery 中的 one 事件处理程序,它只允许触发一次
例如
$("#post_submit_button").one("click", function(){ //run ajax call and use .done and .error notify user });
其他选项是使用 awesome jqeury.validate js 库来使用实时验证而不提交表单,当所有值都有效时,提交并禁用按钮。
例如
$("form#imageupload").validate({
rules: {
"image[title]": {
required: true,
minlength: 3,
maxlength: 100
},
submitHandler: function(form) {
//disable the button
$('#post_button').attr('disabled','disabled');
var formData = new FormData(form);
$.ajax(
})
.done(function (response) {
if (response.success == 'success') {
//alert('success');
} else {
//alert('fail');
}
}).error(function(data) {
//this will run when no server,or ajax cannot go forward
$('#post_button').removeAttr('disabled');
});
return false; // required to block normal submit since you used ajax
}
我的建议是在所有按钮中使用 data-disabled-with
属性,这对你有用:
<%= f.submit "Submit", data: { disable_with: "Wait please..." } %>
这样,每次单击按钮时,它都会被禁用以防止重复提交,并且还会显示文本 "Wait please..."
如果您在表单中使用客户端验证,请小心。在这种情况下,您必须手动删除 disabled
属性,否则您的按钮将保持禁用状态。