ruby-on-rails - 在获取数据之前提交表单的隐形recaptcha
问题描述
我正在使用recaptcha gem。导轨 5.2。
我有以下表格:
= simple_form_for @quote_request_form, url: quote_requests_path, html: {id: "invisible-recaptcha-form"} do |f|
.form-group
= f.input :name, label: false, placeholder: 'First and Last Name',
.form-group.actions.mt-5
button.btn.btn-primary.btn-lg.btn-block#submit-btn Submit
= invisible_recaptcha_tags ui: :invisible, callback: 'submitInvisibleRecaptchaForm'
我为表单添加了以下 javascript:
javascript:
document.getElementById('submit-btn').addEventListener('click', function (e) {
e.preventDefault();
grecaptcha.execute();
});
var submitInvisibleRecaptchaForm = function () {
document.getElementById("invisible-recaptcha-form").submit();
};
我在控制器中检查 recaptcha 的值,如下所示:
if verify_recaptcha(model: @quote_request_form) && @quote_request_form.save
redirect_to quote_confirm_path, notice: "Your quotation request is being processed"
else
render :new
end
只要我使用 e.preventDefault(); 这一切都有效 线。如果我删除此行,我会在 recaptcha 上遇到故障,并且我可以在参数中看到 recaptcha 属性正在以空白数据发送。
我不明白为什么我需要它,因为没有文档指定它。所以我做错了什么,但我无法弄清楚。
谁能看到我如何解决这个问题?
解决方案
您需要该e.preventDefault()
语句,否则表单将在 recaptcha 执行回调之前提交。
发生这种情况是因为<button>
没有类型属性具有submit
默认值/行为。如果您查看recaptcha 文档,该<button>
标签的type属性定义为button
,它没有关联的行为,因此当您单击它时不会发生任何操作。
回到你的情况,要么保留e.preventDefault()
语句,要么将type属性设置为button
:
.form-group.actions.mt-5
button.btn.btn-primary.btn-lg.btn-block#submit-btn type="button" Submit
= invisible_recaptcha_tags ui: :invisible, callback: 'submitInvisibleRecaptchaForm'
推荐阅读
- plot - 朱莉娅:渐变绘图
- android - Expo + Firebase authentication (Identity Toolkit) API key android 限制
- eclipse - EGit:执行失败(SignatureException):签名编码错误
- ios - iOS 15 beta RemoteIO 单元输出具有立体声方向的静音帧
- javascript - 当我单击按钮时,问题没有进入下一个问题
- python - Keras 权重衰减正则化不起作用
- ios - 使用swift向下滚动表格视图时如何使标题/导航栏淡出动画
- azure-ad-b2c - 当授权属性筛选器中的角色检查失败时,为什么 Azure b2c 嵌入式密码重置流程会进入循环?
- javascript - 来自 fetch 调用的 CORS 错误,但来自 NodeJS 没有
- javascript - 如何在 alpine js 中获取动态文本值?