Question

我正在尝试将Google Invisible Captcha集成到我的联系表单中。整合工作在一定程度上，我可以提交表格，然后出现挑战。

但是，我假设添加到div的数据回调会在挑战完成后再次调用我的提交函数？那么目前我必须在挑战完成后第二次点击表单提交按钮？

我已将以下内容添加到我的联系表格中（为简洁而简化）;

<div class="col-md-12">
     <div class="g-recaptcha"
             data-sitekey="mykey"
             data-callback="submitForm"
             data-size="invisible"
             data-bind="formSubmitButton">
     </div>
</div>

<div class="col-sm-12 text-center">
     <input id="formSubmitButton" data-bind="click: submitForm" type="button" class="btn btn-primary btn-block btn-lg" value="Send Enquiry" />
</div>

在我的submitForm方法中，我有以下代码;

this.submitForm = function () { 
...
    //if no field error validate captcha
    if (!error) {
        //validate captcha
        var response = grecaptcha.getResponse();

        if (response.length == 0) {
            grecaptcha.execute();
            return;
        }
    }
...
}

我认为我不应该第二次提交表格是正确的吗？如果是这样的话，我在这里做错了。

Answer 1

您不应该提交表格两次。

我发布了an answer to a similar question关于使用knockout ajax请求设置recaptcha的问题。

您可能需要重新调整表单和功能的设置方式。我发现你可以设置一个jquery函数作为必需的回调函数，调用你的knockout ajax请求。设置您的按钮或隐藏的div以将其作为回调函数发送。我通过使用按钮找到了成功。

你只需要点击按钮，它执行其重新接收的事情（向谷歌发送请求，然后保存其响应，稍后可以访问），然后调用你给它的回调函数，调用你原来的淘汰ajax请求。该请求将像添加recaptcha之前一样正常工作，但是您将发送您的recaptcha响应，就像您使用的那样：var response = grecaptcha.getResponse（）;所以你的服务器可以验证它。

link我证明有更详细的答案，我希望这有帮助。

与Knockout和AJAX Post集成的不可思议的Google ReCaptcha集成

1 个答案: