Pfthb

I use nuxtjs as front end going to put Google recaptcha versi 3 in my site but it always give me google captcha in right bottom, i use recaptcha versi 3

this is my screen shoot

i configure code as documention but still doesn't work, this is my script calling recaptcha google put in head section

function onloadCallback() 
 grecaptcha.ready(function() 
 grecaptcha.execute('6Le3oXkUAAAAACZn9Dbhriy9WFQQTEIqzlmm7bqc12', action: 'action_name')
 .then(function(token) 
 // Verify the token on the server.
 )
 ) 

this is my html

<div class="g-recaptcha" data-sitekey="6Le3oXkUAAAAACZn9Dbhriy9WFQQTEIqzlmm7bqc12" data-bind="recaptcha-submit" data-badge="inline" :style=" display: `block` "></div>

i google and found this but still doesn't work for me, where do i miss

As I see you are using Nuxt, I will provide an example in Vue, the first thing you need to do is add following line in head of HTML code:

 <script src='https://www.google.com/recaptcha/api.js?render=My recaptcha v3 site key'></script>

Then add an on click function for that button:

 executreRecaptchav3: function () 
 grecaptcha.execute('My recaptcha v3 site key', action: 'action_name' )
 .then((token) => 
 //Store this token somewhere so you can send it to your server
 console.log(token);
 );

And here you have your token which will be need in server. As for why there is a recaptcha at the bottom it is there because recaptcha v3 is invisible, however it does not mean it is recaptcha v2 invisible captcha, as that is a different one. Recaptcha v3 returns score rather than just telling true/false.