Google ReCaptcha V3 sirve para verificar que los intentos de login los realiza un humano y no una máquina.
Evita ataques de fuerza bruta, enumeración, etc. Es una buena práctica usar este tipo de medidas en los formularios que estén publicados en internet.
La versión 3 de Google ReCaptcha es invisible, por lo que el usuario no verá la típica ventana de "¿Qué imágenes son camiones?".
Funcionamiento:
1) Para integrarlo en un formulario, hay que crear un captcha en el portal de administración de una cuenta Google: https://www.google.com/recaptcha/admin/create
> Tendremos que asignarle uno o varios dominios y nos devolverá un par de claves público-privada.
> En esta demo, la clave pública es: 6LcHpI0hAAAAAN_qwctTaGCMBaBZaUFGdsz1fq-q
> En esta demo, la clave privada es: 6LcHpI0hAAAAABiT-YN_okh2R1X_TtwaT4jDKckG
2) Cargamos el script de Google ReCaptcha en la aplicación web usando la clave pública como parámetro:
> script src="https://www.google.com/recaptcha/api.js?render=6LcHpI0hAAAAAN_qwctTaGCMBaBZaUFGdsz1fq-q"
3) Añadimos en la etiqueta HTML, del botón del formulario, los attributos de Captcha.
Hay varios tipos de atributos con comportamientos diferentes, en este ejemplo se toma control completo del proceso, hay atributos que automatizan más el proceso, dándole el control a Google.
> class="g-recaptcha-response" data-sitekey="6LcHpI0hAAAAAN_qwctTaGCMBaBZaUFGdsz1fq-q"
4) En el evento onClick del botón recibimos un token.
> Primero llamamos a grecaptcha.ready()
> En su función de callback llamamos a grecaptcha.execute() con nuestra clave pública y la acción submit como parámetros.
> En el callback de grecaptcha.execute(), Google, nos devolverá un Token.
Hay diferentes parámetros de grecaptcha.execute(), pueden consultarse en: https://developers.google.com/recaptcha/docs/v3
5) Este token hay que mandarlo al servidor de la aplicación web a un endpoint que hayamos creado para ello o con la propia petición de login.
A partir de aquí todo sucede en el servidor, NUNCA EN EL FRONTAL, en esta demo se hace en el frontal por simplificar la explicación.
6) El servidor recive el token y lo verifica.
> Para ello se hace un POST a https://www.google.com/recaptcha/api/siteverify
> En los parámetros va nuestra clave privada, el token que hemos recibido y opcionalmente la IP origen del servidor.
> La documentación: https://developers.google.com/recaptcha/docs/verify
> Entre otros parámetros, el que nos importa es el de "score" dónde se analiza que probabilidad de que sea un bot hay y nos permitirá decidir como actuar.
> Si el "score" es 1.0 es que es muy probable que sea un humano, si es 0.0 es muy probable que sea una máquina.
Vamos a probarlo, introduce unos datos de login ficticios...