I have an issue somewhat similar to this scenario : I got "timeout-or-duplicate" error using ReCaptcha v3
In may scenario i have a form and a button that perfrom submit of the form. Inside the form a setInterval keep the recaptcha fresh :
<script src="https://www.google.com/recaptcha/api.js?render=<%=ServiceLocator.AppConfigProvider.Instance.RecaptchaPublicKey%>"></script>
<script>
onSetupDone(function () {
getReCaptcha();
setInterval(function () { getReCaptcha(); }, 90000);
function getReCaptcha() {
grecaptcha.ready(function () {
grecaptcha.execute('<%=ServiceLocator.AppConfigProvider.Instance.RecaptchaPublicKey%>', { action: globals.currentPage }).then(function (token) {
document.getElementById("reCAPTCHAResponse").value = token;
});
});
};
/**
* Get a previously stored RecaptchaToken
* */
window.getReCaptchaValue = function () {
var result = document.getElementById("reCAPTCHAResponse").value;
getReCaptcha();//refresh the value
return result;
};
});
</script>
the OnSetupDone() is a function equivalent to document ready (it's called once per page, when document is ready and all setup phase is done).
My problem is that when user click twice the button that cause form submit, multiple form are submitted (and then cancelled when a next click occured)
But if the cancellation occurred only after the server use of recaptcha token, i end up using a token twice. And so request is declined (timeout-or-duplicate error). What is not clear to me is which is the whay to handle situation like that (avoid use a recaptcha token twice in a from submit).
Should i add an handler in the form submit event and take another captcha? (this does not guarantee me that the next submit will be processed after the form sumbit event enqueued by javascript.. so i guess answer is still no)
PS : as shown in the picture, the page (an asp.net page) does not reload while the submit is processed. This also contribute to the fact that the old token is retained by the alredy submitted form.
