Como agregar reCAPTCHA v3 a formularios de PHP


reCAPTCHA en su versión 3 es la menos molesta para los usuarios, Google hace un gran trabajo al diferenciar a un Robot de un Humano a través de su comportamiento, por ejemplo, al rastrear el movimiento del Mouse o Ratón y otros factores que Google mantiene en secreto para que los programadores de robots no vulneren el algoritmo.

Versión en video

En caso de que prefieras aprender viendo, aquí hay un video sobre el mismo contenido en este artículo:

Registrar tu dominio en Google reCAPTCHA.

Lo primero que debes de hacer es registrar tu dominio en Google reCAPTCHA, para esto ingresas en esta dirección: https://www.google.com/recaptcha/admin/create

Ahí debes ingresar la información en el formulario, como una etiqueta, seleccionar reCAPTCHA V3, los dominios en los que vas a utilizar reCAPTCHA y aceptar algunos términos.

Formulario para agregar recaptcha en tus sitios web

Cuando envíes el formulario de registro, Google te mostrará una pantalla como esta, en donde te proporciona una clave de sitio web y una clave secreta, debes guardar estos valores para usarlos más adelante.

Claves de Google recaptcha

Crear un formulario para capturar la información en PHP

Ahora crearemos un formulario y para simplificarlo únicamente vamos a solicitar un correo electrónico. Crea un archivo con este nombre form.php y agrega este código:

<html>
  <head>
    <title>reCAPTCHA v3</title>
    <script
	  src="https://code.jquery.com/jquery-3.4.1.slim.min.js"
	  integrity="sha256-pasqAKBDmFT4eHoN2ndd6lN370kFiGUFyTiUHWhU7k8="
	  crossorigin="anonymous"></script>
 
	<!-- Cambia 6LcZu9QUAAAAACaj-WBiVIQUlr94vfCC8DUpIanS por tu clave de sitio web -->
    <script src="https://www.google.com/recaptcha/api.js?render=6LcZu9QUAAAAACaj-WBiVIQUlr94vfCC8DUpIanS"></script>
  </head>
  <body>
    <h1>
      Formulario de registro
    </h1>
 
    <form id="form" action="form-post.php" method="post">      
	  <input type="email" id="email" name="email">          
	  <input type="submit" value="submit">          
    </form>
 
	 
    <script>
    $('#form').submit(function(event) {
        event.preventDefault();
        /*Cambia 6LcZu9QUAAAAACaj-WBiVIQUlr94vfCC8DUpIanS por tu clave de sitio web*/
        grecaptcha.ready(function() {
            grecaptcha.execute('6LcZu9QUAAAAACaj-WBiVIQUlr94vfCC8DUpIanS', {action: 'registro'}).then(function(token) {
                $('#form').prepend('<input type="hidden" name="token" value="' + token + '">');
                $('#form').prepend('<input type="hidden" name="action" value="registro">');
                $('#form').unbind('submit').submit();
            });;
        });
  });
  </script>
  </body>
</html>

Voy a destacar 3 partes importantes del código anterior, en la primera agregamos dos scripts, uno es jQuery que nos ayuda a escribir el código de JavaScript que vamos a utilizar y el otro es la librería de reCAPTCHA. En este script debes de cambiar la cadena 6LcZu9QUAAAAACaj-WBiVIQUlr94vfCC8DUpIanS por la clave de sitio web que generaste anteriormente.

En la segunda parte está el formulario, este es un formulario básico de HTML, no hay nada especial que mencionar.

En la tercera parte está el código de JS que se encarga de evaluar si es un humano o un robot. Puedes reutilizar este código en tus formularios, solo debes de cambiar la clave de sitio web, como en la primera parte.

Como procesar un formulario con reCAPTCHA en PHP

Ahora vamos a crear un archivo llamado form-post.php y vamos a ingresar este código:

<?php
// Ingresa tu clave secreta.....
define("RECAPTCHA_V3_SECRET_KEY", 'TU-CLAVE-SECRETA');

$token = $_POST['token'];
$action = $_POST['action'];
 
// call curl to POST request
$ch = curl_init();
curl_setopt($ch, CURLOPT_URL,"https://www.google.com/recaptcha/api/siteverify");
curl_setopt($ch, CURLOPT_POST, 1);
curl_setopt($ch, CURLOPT_POSTFIELDS, http_build_query(array('secret' => RECAPTCHA_V3_SECRET_KEY, 'response' => $token)));
curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
$response = curl_exec($ch);
curl_close($ch);
$arrResponse = json_decode($response, true);
 
// verificar la respuesta
if($arrResponse["success"] == '1' && $arrResponse["action"] == $action && $arrResponse["score"] >= 0.5) {
    // Si entra aqui, es un humano, puedes procesar el formulario
	echo "ok!, eres un humano";
} else {
    // Si entra aqui, es un robot....
	echo "Lo siento, parece que eres un Robot";
}

En el código anterior se recupera la información de reCAPTCHA y se guarda el resultado en la variable $arrResponse luego podemos consultar que tan seguro esta Google de si es un humano al consultar la variable $arrResponse["score"], la cual tiene un 0.0 si está seguro de que no es humano y un 1.0 si está totalmente seguro de que si es humano. Por eso vamos a tomar como válido un valor de 0.5 en adelante.

Puedes reutilizar este código, solo debes de cambiar la clave secreta, por la clave que obtuviste cuando te registraste en Google reCAPTCHA.

Para que todo esto funcione debes probarlo en un servidor y con un dominio que hayas registrado en el formulario de registro. Si no tienes acceso a un servidor con un dominio, puedes editar el archivo host de tu computadora para simular que tienes un dominio.

Todo el código mostrado en este artículo, está escrito para ejemplificar como puedes integrar Google reCAPTCHA v3 en tus formularios. Por eso he omitido código muy importante para sistemas en Producción como la validación de entradas de usuario, si utilizas esto en un sistema, debes asegurarte de limpiar todas las entradas de usuario para evitar procesar código dañino.