Error: No reCAPTCHA clients exist (reCAPTCHA v3)

I've integrated reCAPTCHA v3 in one of my forms. In onload, there's a token produced and google captcha logo in the bottom right corner. But when I submit the form, in console there is an error shown, "Error: No reCAPTCHA clients exist". Also, it seems, no data is fetched by "g-recaptcha-response" and $_POST["g-recaptcha-response"] remains empty.

Here is the sample code:

<script type="text/javascript">
    var ReCaptchaCallbackV3 = function() {
        grecaptcha.ready(function() {
            grecaptcha.execute("site_key").then(function(token) {
                console.log("v3 Token: " + token);
            });
        });
    };
</script>

<script src="https://www.google.com/recaptcha/api.js?onload=ReCaptchaCallbackV3&render=site_key"></script>

It doesn't produce any "g-recaptcha-response" when the form is submitted.

I don't know much about google reCaptcha. I've followed the documentation provided by them and used a site and a secret key in the proper way.

Can anybody please tell me where might be the problem and what is the possible solution?

Have you tried loading the script before trying to send the request?

<script src="https://www.google.com/recaptcha/api.js?onload=ReCaptchaCallbackV3&render=site_key"></script>
<script type="text/javascript">
    var ReCaptchaCallbackV3 = function() {
        grecaptcha.ready(function() {
            grecaptcha.execute("site_key").then(function(token) {
                console.log("v3 Token: " + token);
            });
        });
    };
</script>