Блог

Главная - Вопросы по программированию - Google reCAPTCHA v3: не удается отправить форму в режиме обратного вызова данных

Google reCAPTCHA v3: не удается отправить форму в режиме обратного вызова данных

#recaptcha

#recaptcha

Вопрос:

Когда я нажимаю кнопку «Отправить», форма не отправляется. Почему?

Я получил это прямо из примера кода Google, все, что я добавил, было одной строкой:

document.getElementById(«моя форма»).submit();

Было показано сообщение «спасибо».

Если я нажму кнопку «Отправить без проверки», форма будет отправлена.

 <html>
<head>
<script>
    function onSubmit(token) {
        alert('thanks '   document.getElementById('name').value);
        document.getElementById("myform").submit();
    }

    function validate(event) {
        event.preventDefault();
        if (!document.getElementById('name').value) {
            alert("You must add text to the required field");
        } else {
            grecaptcha.execute();
        }
    }

    function onload() {
        var element = document.getElementById('submit');
        element.onclick = validate;
    }
</script>
<script src="https://www.google.com/recaptcha/api.js" async defer></script>
</head>
<body>
<form action="/Second/Save" method="post" id="myform">
    Name: (required) <input id="name" name="name">

    <div id='recaptcha' class="g-recaptcha"
         data-sitekey="6LexWMMZAAAAAGpLECkk-pfZ-sYuQ9qDu7wiMJ3M"
         data-callback="onSubmit"
         data-size="invisible"></div>

    <button id='submit'>submit</button>
    <button onclick="onSubmit();">Submit Without Validate</button>
</form>
<script>onload();</script>
</body>
</html>

Ответ №1:

Проблема в том, что у вас есть кнопка в форме с идентификатором «отправить». Любой элемент в форме с именем или идентификатором отражается в атрибуте формы с этим именем. Поэтому, если у вас есть объект form, у него будет атрибут «elephants». В этом случае кнопка отправки доступна через form.submit, но это маскирует функцию отправки().

Если элемент управления формой (например, кнопка отправки) имеет имя или идентификатор отправки, этот метод будет маскировать метод отправки формы.

MDN Web docs

Ответ №2:

Пожалуйста, проверьте ключ вашего сайта, эта ошибка в основном возникает, когда ваш домен не соответствует ключу вашего сайта.

Вы можете создать свой собственный ключ Google captcha для своего домена с помощью своей учетной записи Google, это бесплатно, по ссылке, приведенной нижеhttps://www.google.com/recaptcha/admin/create

Комментарии:

1. С ключом сайта проблем нет. Если я использую неправильный ключ, onSubmit не будет вызван. Но теперь она вызывается. Это просто «document.getElementById («myform»).submit();» каким-то образом пропускается.

2. Это была моя проблема, потому что я не считал, что тестировал с localhost.