A continuación encontrarás la forma de implementar Recaptcha V3 Google en uno o varios formularios con php.
Muchas veces nos hemos visto en la necesidad de tener más de un formulario en una misma sección de la página con su respectivo captcha. Sin embargo, esto también puedes usarlo para un formulario, los pasos para implementar recaptcha v3 con php son los mismos.
Empezamos:
Ingresa al Admin Console de Google y registra el dominio de tu página.
https://www.google.com/recaptcha/admin
Voy a usar un dominio falso para poder obtener las claves secretas. Por ejemplo minuevohogar.com, tú reemplazarás esto por tu dominio real.
Luego aparecerá la siguiente pantalla. Llenas el formulario, aceptas las condiciones y haces clic en el botón ENVIAR
Ahora ya tienes las claves secretas
1) Integrar las claves secretas en el código HTML – Frontend
La primera clave secreta se coloca en el lado frontal o cliente(puede ser un html, php, etc).
Colocar dentro de las etiquetas <HEAD></HEAD> el siguiente código:
<script src="https://www.google.com/recaptcha/api.js?render=aqui_primera_clave"></script>
<script>
grecaptcha.ready(function () {
grecaptcha.execute('aqui_primera_clave', { action: 'contact' }).then(function (token) {
var recaptchaResponse1 = document.getElementById('recaptchaResponse1');
var recaptchaResponse2 = document.getElementById('recaptchaResponse2');
recaptchaResponse1.value = token;
recaptchaResponse2.value = token;
console.log(recaptchaResponse1);
console.log(recaptchaResponse2);
});
});
</script>
Quedando como el siguiente print:
a) Si deseas tener varios formularios en una sola sección, haz lo siguiente:
Agrega un input de tipo hidden en cada formulario, para colocar el valor que arroja el captcha. Este control debe tener el mismo name en todos los formularios. Debe quedar como el siguiente print:
b) En caso necesites para un formulario, coloca el input hidden sólo una vez dentro de la etiqueta form.
2) Recuperar los valores de los archivos html y validarlo en el backend con php
Colocar la segunda clave secreta en el archivo php de tu backend, para recuperar los valores del frontend.
Recuerda que el score o puntuación del recaptcha debe ser mayor o igual a 0.5. Por debajo de este valor no bloqueará el spam.