I recently implemented invisible reCAPTCHA successfully, but I'm wondering if I did it correctly when calling grecaptcha.execute().
After loading the API script with an explicit call like this:
<script src="https://www.google.com/recaptcha/api.js?onload=onloadCallback473&render=explicit"
async defer>
<script type="text/javascript">
var onloadCallback473 = function() {
widgetId_473 = grecaptcha.render('recaptcha_473', {
'sitekey' : 'MY KEY XXXXXXXXXXX',
'size' : 'invisible',
'badge' : 'inline', });
grecaptcha.execute(widgetId_473);
};
</script>
The form follows this code due to ASYNC DEFER.
When a user submits the form via AJAX, my handling code looks like this:
'success': function(response) {
if (response.success) {
}
else {
//validation error
//Such as empty fields or incorrect email format
grecaptcha.reset(widgetId_473);
grecaptcha.execute(widgetId_473);
}
My question is: "Is it acceptable to call the grecaptcha.execute() function twice?"
Once before hitting the submit button and once after in case of an error?