Невидимая Google Captcha v2 не работает должным образом - PullRequest
0 голосов
/ 28 сентября 2018

Следующий код работает нормально, если форма отправлена ​​правильно со всеми действительными данными с первой попытки.Если после отправки формы возникает какая-либо ошибка на стороне сервера, то при повторной отправке пользователем формы recaptcha не сбрасывается.Вот пример кода:

html-форма

<script src="https://www.google.com/recaptcha/api.js"></script>
<div>
<form name="signupForm"  method="POST" action="/signup">
    <div class="form-group mobile-number">
        <input type="tel" id="mobileNo" class="form-control" name="mobileNumber" maxlength="10"
               autofocus>

    <label for="mobile"> Your Mobile no. </label>
    </div>
    <div class="g-recaptcha"
        data-sitekey="{key}"
        data-callback="setResponse"
        data-badge="inline"
        data-size="invisible">
    </div>
    <input type="hidden" id="captcha-response" name="captcha-response"/>
    <button id="submitButon" type="submit">Sign me up!</button>
</form>
</div>

javascript

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

<script>
    function setResponse(response) {
        document.getElementById('captcha-response').value = response;
        submitForm();
    }

    function submitForm() {
        var $form = $("form");
        var data = JSON.stringify($form.serializeObject());
        var myJsonObject = JSON.parse(data);

        data = JSON.stringify(myJsonObject);

        $.ajax({
            type: "POST",
            url: "dummy url",
            contentType: "application/json",
            xhrFields: {withCredentials: true},
            data: data,
            success: function (data, textStatus, request) {
                // success
            },
            error: function (xhr, err) {
                // logics here
                grecaptcha.execute();
                setResponse;
            }
        });
    }
</script>

<script>
    jQuery(document).ready(function () {

        //homepage form
        $('form[name="signupForm"]').validate({
            onfocusout: function (element) {
                $(element).valid();
            },
            rules: {
                mobileNumber: {
                    required: true,
                    minlength: 10,
                    maxlength: 10
                }
            },
// Specify validation error messages
            messages: {
                mobileNumber: "A valid mobile number is of 10-digit",

            },
//submit handler
            submitHandler: function (form) {
                submitForm();
            }
        });
    });
</script>

Я думаю, что ошибканаходится в состоянии вызова ajax, но не может выяснить, почему капча не сбрасывается снова.

...