2
votes

I cant get reCAPTCHA v3 working on my website. I have put the right code in from the Google reCAPTCHA v3 website but it shows "ERROR for site owner: Invalid site key" in the bottom right.

I'm only 7 and if I have missed something, please take it easy

 <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Recaptcha test</title>
    <script src="https://www.google.com/recaptcha/api.js"></script>
    <script>
      function onSubmit(token) {
          document.getElementById("demo-form").submit();
      }
    </script>
    <script src="https://www.google.com/recaptcha/api.js?render=reCAPTCHA_site_key"></script>


<body>
<button class="g-recaptcha"
        data-sitekey="reCAPTCHA_site_key"
        data-callback='onSubmit'
        data-action='submit'>Submit</button>
<script>
    function onClick(e) {
        e.preventDefault();
        grecaptcha.ready(function() {
            grecaptcha.execute('reCAPTCHA_site_key', {action: 'submit'}).then(function(token) {
                // Add your logic to submit to your backend server here.
            });
        });
    }
</script>


</head>
</body>
</html>

Then, I tried reCAPTCHA v2 Checkbox, same things happened. Although, "ERROR for site owner: Invalid site key" was now in the top left:

    <!DOCTYPE html>?
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Recaptcha test</title>
    <script src="https://www.google.com/recaptcha/api.js" async defer></script>

    <script src="https://www.google.com/recaptcha/api.js?onload=onloadCallback&render=explicit"
            async defer>
    </script>



<body>
<form action="?" method="POST">
    <div class="g-recaptcha" data-sitekey="your_site_key"></div>
    <br/>
    <input type="submit" value="Submit">
</form>
<script type="text/javascript">
    var onloadCallback = function() {
        alert("grecaptcha is ready!");
    };
</script>



</head>
</body>
</html>
1

1 Answers

2
votes

I have tried your code of reCAPTCHA v3 which you have mentioned.

  • reCAPTCHA_site_key is at three places please check if you have replaced it with correct site key under heading: "COPY SITE KEY".

  • Reason that it's showing "ERROR for site owner: Invalid site key" is you might be trying file system to access the key. It doesn't work on file systems ie, this will not work: file:///E:/Personal%20Data/stackoverflow/recapcha.html

  • Host your site on local server like IIS/Node etc, and add the same domain in domain configurations of recaptcha.

    for example if your website is: https://www.testingrecapcha.com/ then add testingrecapcha.com in domains of rechapcha configurations. (to reach admin console of recapcha, use this: https://www.google.com/recaptcha/admin and select your relevant site and click on settings icon).