Base de conocimientos

Búsqueda Inteligente

Cómo implementar google reCaptcha para mis formularios

Al desarrollar un sitio web que contiene un formulario de contacto estamos expuestos a que este formulario sea utilizado para enviar correos electrónicos no deseados.

Una solución para prevenir el SPAM a través de un formulario de contacto y/o registro es utilizar Google reCaptcha en cualquiera de sus versiones.

En esta ocasión utlizaremos la versión 2.

  1. ingrese a http://www.google.com/recaptcha
  2. ingrese a la sección "Admin console" (en la parte superior derecha)
  3. haga click en el símbolo de "+"
  4. agregue su nuevo dominio al que será aplicado el captcha
  5. La llave del sitio así como la clave secreta son necesarias para poder implementarlo dentro de su desarrollo

 

Una vez que se haya generado la llave exitosamente deberá de colocar dentro de su desarrollo lo siguiente: 

Entre las etiquetas <head> y </head> colocar el siguiente script

<script src='https://www.google.com/recaptcha/api.js?hl=es'></script>

Colocar el siguiente código donde deseas que aparezca el elemento reCaptcha, es importante que sustituyas la llave del sitio por el que haz generado anteriormente dentro de Google:

<div class="g-recaptcha" data-sitekey="6LcePAATAAAAAGPRWgx90814DTjgt5sXnNbV5WaW">div>

Probando reCaptcha

Copia de la librería recaptchalib.php. Ponlo en la raíz de tu proyecto y luego haz referencia a el en la parte de arriba de tu archivo php.

 


// grab recaptcha library
require_once "recaptchalib.php";
?>

 

Esta biblioteca contiene una colección de funciones que envían el g-recaptcha-response (junto con nuestra clave secreta) a Google via una solicitud HTTP. Ellos entonces toman la respuesta, revisando ya sea si el CAPTCHA fue exitoso o no. Para usar esto necesitamos primero ajustar un par de variables, antes de cerrar la etiqueta PHP:

// your secret key
$secret = "6LcePAATAAAAABjXaTsy7gwcbnbaF5XgJKwjSNwT";
// empty response
$response = null;
// check secret key
$reCaptcha = new ReCaptcha($secret);

ReCaptcha() verifica si nuestra clave secreta está presente.

// if submitted check response
if($_POST["g-recaptcha-response"]) {
    $response = $reCaptcha->verifyResponse(
        $_SERVER["REMOTE_ADDR"],
        $_POST["g-recaptcha-response"]
    );

Asumiendo que todo esté bien con nuestro formulario enviado, la variable $response reportará de vuelta con "success" y podemos continuar a procesar los datos de formulario. Aquí está como podría verse: remove la parte donde hicimos bucle sobre los datos del formulario, entonces agrega la siguiente comprobación arriba del formulario:

  if ($response != null && $response->success) {
    echo "Hi " . $_POST["name"] . " (" . $_POST["email"] . "), thanks for submitting the form!";
  } else {
?>

Finalmente, agrega una etiqueta de cerrado luego del formulario:

}
?>

Esto muestra el formulario, a menos que haya sido exitosamente enviado, en tal caso mostrará un pequeño mensaje de agradecimiento.