Aprende a implementar el reCAPTCHA, la API de Google para el famoso “YO NO SOY ROBO”, en Scriptcase.

¿Primero qué es el reCAPTCHA?

El reCAPTCHA es un recurso con sistema de cajas de diálogo desarrollado por la Universidad Carnegie Mellon en Pittsburgh e implementa un algoritmo aleatorio muy utilizado en sistemas de autenticación, a fin de evitar ataques de “Brute Force”, es decir, tiene como objetivo garantizar que un ser humano está interactuando con el sistema en tiempo real. En 2009 Google adquirió esta herramienta y actualmente es ampliamente usada, especialmente por New York Times y Google Books.

Scriptcase – Recursos Avanzados

Para implementar el reCaptcha Google al Scriptcase haremos uso de clases externas.
La api reCaptcha nos proporcionará código JavaScript que se inserta en la aplicación Scripcase.
Utilizamos una clase PHP para capturar la respuesta de reCAPTCHA a la que podemos dar el tratamiento necesario para evitar posibles invasiones.

Google

En este enlace obtendrá las claves secretas del sitio para la confirmación de la Api:

https://www.google.com/recaptcha

Captura de pantalla de 2018-10-08 10-35-11

Captura de pantalla de 2018-10-08 11-09-55

Captura de pantalla de 2018-10-08 14-32-59

Scriptcase: Creación de una aplicación de control

Debe adquirir la biblioteca recaptchalib.php.

Crear una biblioteca externa en Scriptcse, sugiero crear como pública, con el nombre: reCaptcha y añada el archivo php del enlace arriba como recaptchalib.php

Cree una aplicación de control con dos campos como por ejemplo, el asunto y el mensaje.

Captura de pantalla de 2018-10-09 09-50-10

Agregar la biblioteca reCAPTCH

Introduzca el código siguiente en el evento onScriptInit. Incluyendo acceso la API Javascript de Google e incorporando la Biblioteca Externa recaptchalib.php

?>
<script src=’https://www.google.com/recaptcha/api.js’></script>
<?php

sc_include_library(‘sys’,’reCaptcha’,’recaptchalib.php’);

Capturando y tratando el retorno de la API reCAPTCHA

Introduzca el código siguiente en el evento onValidate.

if (isset($_POST[‘g-recaptcha-response’])) {
$captcha_data = $_POST[‘g-recaptcha-response’];
}

if (!$captcha_data) {
sc_error_message(‘Asegúrese de que usted no es un robot, haga clic en la casilla de verificación!’);
}else{

$secret = “### Su clave secreta ###”;

$response = null;

$reCaptcha = new ReCaptcha($secret);

if ($_POST[“g-recaptcha-response”]) {
$response = $reCaptcha->verifyResponse(
$_SERVER[“REMOTE_ADDR”],
$_POST[“g-recaptcha-response”]
);
}

if ($response != null && $response->success) {
sc_alert(“Mensaje enviado con éxito!”);
} else {
sc_error_message( “Usuario mal intencionado detectado. El mensaje no fue enviado.”);
}
}

Agregar la caja de confirmación robot / humano

Introduzca el siguiente  código en “Descripción de ayuda = Texto” del campo Mensaje de la aplicación

<br>
<div class=”g-recaptcha” data-sitekey=”###su clave del sitio o SiteKey###”></div>

 

Captura de pantalla de 2018-10-09 10-12-45

Entendiendo el concepto…

¿Cómo detectar si no es un robot accediendo a su aplicación?

Captcha de imágenes distorsionadas se ha vuelto cada vez menos habitual debido a la dificultad que el usuario / internauta tiene para convencer que es un ser Humano encendiendo la página de referencia.

Api de Google ha hecho que este proceso de confirmación sea más fácil con un clic en una casilla de verificación. En realidad Google ya sabe que antes de llegar a una determinada página que ya estaba interactuando con el navegador.

Puede suceder, cuando la api desconfía del acceso, forzar la visualización de una pantalla con imágenes que sólo un ser Humano reconocería.

Las actualizaciones recientes permiten dejar invisible hasta la caja de confirmación añadiendo a su botón de envío del formulario el código para acceder a api.

En su área administrativa de generación de las claves de validación es posible configurar el nivel de seguridad deseado, dejando más simple o más compleja la verificación.

 

You might also like…

PROCESAMIENTO AJAX EN SCRIPTCASE

Ajax en los formularios de Scriptcase puede usarse para recargar un campo de tipo de select basado e...

IMPORTAR IMAGENES DE LA BASE DE DATOS Y UTILIZAR CLASES DE BOOSTRAP

Como muchas personas ya saben, Bootstrap es una biblioteca de front-end libre y de código abierto p...

TENDENCIAS DE DESARROLLO WEB PARA 2017

Usted verá en este post tendencias para 2017 en Diseño Web, en el medio digital y en el desarrollo...

Comment this post

Get new posts, resources, offers and more each week.

We will use the information you provide to update you about our Newsletter and Special Offers. You can unsubscribe any time you want by clinck in a link in the footer of any email you receive from us, or by contacting us at sales@scriptcase.net. Learn more about our Privacy Police.