23 octubre, 2018 Jose Antonio Vila

Como integrar Google ReCaptcha

Aunque todos lo conocemos, seguro que hay algún despistado al que lo de Google reCAPTCHA le suena a chino. En pocas palabras, se trata de un sistema para diferenciar a “humanos” de “robots” a la hora de enviar algún tipo de información mediante un formulario (formularios de contacto, login, etc.)

¿Y cómo lo hace? Pues tiene una parte de sistema automático, utilizando uno de los secretísimos algoritmos de Google, y por otra un sistema en el que las personas tienen que reconocer ciertos textos o marcar aspectos de una imagen que se muestra al usuario.
Al tener esa parte de misterio de la compañía, es imposible saber porqué en ciertas ocasiones le vale el simple “click” y de manera automática te reconoce como “humano” y en otras tienes que hacer las pruebas con fotos y palabras.

En cualquier caso, lo que nos interesa aquí es cómo podemos incluirlo en nuestra web y, de esta manera, proteger nuestros formularios del SPAM y darles un toque extra de seguridad. En esta ocasión vamos a ver cómo hacerlo en PHP, pero es fácilmente replicable a otros lenguajes de programación.

Primer paso: hablemos con Google

Esta es la parte más sencilla: solamente tenemos que ir al siguiente enlace y registrar nuestro sitio web.
En primer lugar nos pedirá una Etiqueta, para ayudarnos a identificar la página donde vamos a integrar el reCAPTCHA.
Después tocará elegir el tipo de reCAPTCHA que vamos a querer utilizar. En mi caso, siempre utilizo el clásico del checkbox y el mensaje “Yo no soy un robot”.
A continuación indicaremos el dominio sobre el que aplicaremos este captcha. ¡Atención! No vale trabajar en local, hay que introducir un dominio real.

Después de esto solo nos quedará aceptar las condiciones de uso y darle al botón para continuar.

Añadiendo Google ReCaptcha a tu sitio

Con toda la información rellenada, lo siguiente que tendremos serán una serie de claves y datos que son las que necesitaremos en el código de nuestra página web. Los datos más importantes de esta pantalla son la Clave del sitio y la Clave secreta, así que apúntalo y guárdate esa información que la vamos a necesitar.
Obviamente, todos estos datos son privados y no debes facilitarlos a nadie y/o dejarlos públicos en tu sitio web.

Una vez con estas dos claves, vamos al código de nuestra página.
Lo primero es cargar dentro de la etiqueta (también puede ser al final de la página, pero es recomendable colocarlo aquí) el script que nos da Google para el correcto funcionamiento del reCAPTCHA:

Después, tenemos que indicar dónde queremos que aparezca nuestro captcha. Para ello, ponemos el código correspondiente en el lugar que hayamos elegido:

Con estos dos pasos, ya deberíamos visualizar el reCAPTCHA en nuestro sitio, pero todavía no estaría funcionando, falta la parte PHP que le haga cumplir con su función.

Integrando Google ReCaptcha en PHP

Llegados al momento del backend, contamos con dos opciones.
Para la primera, empezaremos descargando esta librería e incluyéndola en la página PHP que se encarga de procesar y enviar los datos del formulario:

Después solo tendremos que copiar este código en el momento que queramos verificar que el código es correcto y trabajar con la información que recibimos

Básicamente lo que hace este código es validar en primer lugar la clave secreta y después, con la IP del usuario y el valor que llega del Captcha, valida que sea “humano” y no un “robot”.

Tenemos también una segunda opción basada en cURL y para la que no hace falta ninguna librería externa. En este caso, el código que utilizaríamos sería:

De esta manera, en vez de cargar una librería externa, lo que hacemos es mediante cURL enviar a Google la misma información (IP, clave secreta y valor del captcha) y obtener una respuesta positiva o negativa.

Con esto, ya estaría todo listo. Pasos muy sencillos que ayudarán muchísimo a la seguridad de tu sitio.
Si de todas formas encuentras algún problema durante su integración, siempre te quedará la guía de Google o los comentarios de esta entrada.

Sobre mí

Jose Antonio Vila Desarrollando webs desde hace más de 10 años. Media vida en agencias y la otra media como freelance, tengo la experiencia de los años y los profesionales de los dos mundos. Jose A. en Google+

Comments (4)

  1. Antonio

    Hay un error en la guia, al decodificar las variables de la respuesta del curl. Así es como está en la guía.

    $res = curl_exec($curl);
    curl_close($curl);

    $resp = json_decode($resp, true);

    Pero así esta intentand sacar las variables json de $resp, que todavía no está definida. La inclusion correcta sería, así: Sacando las variables de $res donde se han guardado.

    $res = curl_exec($curl);
    curl_close($curl);

    $resp = json_decode($res, true);

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *