reCAPTCHA невидим без функции обратного вызова

Question

У меня есть форма, которая обрабатывается с помощью прослушивателя событий и не очень хорошо работает с функцией обратного вызова recaptcha.

Внутри формы:

форма

<form class="myform>
...
<button class="g-recaptcha" data-sitekey="your_site_key" data-callback='onSubmit'>Submit</button>
</form>

Теперь это зависит от функции onSubmit обрабатывать, чтобы получить токен, как показано ниже.

обратный вызов reCaptcha и обработчик токена

var onSubmit = function(token) {
  console.log('token');
};

Однако я хочу получить токен в моем обработчике формы ниже. onSubmit и EventListener ниже запускаются в то же время, но не могут поменять токен.

Мой обработчик форм, где я хочу токен

$('form.myform').submit(function (event) {

    event.preventDefault();

    var form = $(this);
    var token = ''; // how do I get the token?
    submitForm(form, token); // token is not defined here but I want it to be

});

Answer 1

Вы должны активировать форму отправки:

var onSubmit = function(token) {
    $( "form.myform" ).submit();
};

Ваша обработчик отправки формы:

$('form.myform').submit(function (event) {

    event.preventDefault();

    var form = $(this);
    var token = grecaptcha.getResponse(); 
    submitForm(form, token);

});