Jump to content
soy.amarillo

Añadir reCaptcha a formularios de creación y contacto

Recommended Posts

Hola a tod@s!

 

Este es mi primer post, así que me presento un poco. Me llamo José Manuel y llevo con prestashop menos de una semana. Hasta ahora he programado en tiendas online pero hechas a medida, para empresas importantes a nivel nacional e internacional, pero nunca en prestashop.

 

Como digo, esta semana he tenido que instalar este sistema como tienda online. En principio bien, en pocos días he entendido el funcionamiento, las plantillas (este tema creo que se puede mejorar bastante), los módulos, etc.

 

Bueno, al instalarlo me he dado cuenta de que los formularios de creación y contacto no tenían captcha, algo básico si no quieres que tus buzones de correo o cuentas se llenen hasta el infinito y más allá... Así que pensé en buscar un módulo en la web de prestashop, y descubrí con sorpresa que cuesta aprox. unos 20 euros... Así que me puse manos a la obra y he creado código para añadirlos. Como soy nuevo, no he creado un módulo, ya que la verdad es que por ahora no sé cómo hacerlo, sino que he modificado los controladores y plantillas necesarios. Os dejo aquí el código que he realizado.

 

Este post además tiene como referencia uno que voy a crear nada más terminar este, y es una mejora a realizar en el módulo de contacto, ya veréis por qué. En cuanto redacte el otro post vuelvo a este y pongo el enlace.

Edición: el enlace al post referente a contact form es este: http://www.prestashop.com/forums/topic/181172-improvement-of-contactcontroller/

 

Lo primero es deciros que para evitar problemas en futuras actualizaciones del código, he realizado los cambios en la carpeta override.

Antes de pasar al código en sí, es necesario que nos bajemos la librería recatpcha de Google desde aquí: http://www.google.com/recaptcha

Lo primero será crearnos una cuenta para nuestro dominio. Una vez hecho, nos bajamos los archivos. Yo he decidido poner la librería en la carpeta /tools/reCaptcha, pero lo podrías crear donde a tí te parezca más conveniente. Copiamos a esta carpeta el archivo recaptchalib.php, que acabamos de descargar.

Tenemos que copiar las claves pública y privada que se nos han generado a nuestro proyecto. Yo las he copiado al fichero /config/settings.inc, ya que creo que este archivo no se modifica en las actualizaciones. Añadimos dos líneas como las siguientes:

 

/* Configuración de Google Recaptcha */
define('_GOOGLE_RECAPTCHA_PUBLIC_KEY', 'Aquí tu clave pública');
define('_GOOGLE_RECAPTCHA_PRIVATE_KEY', 'Aquí tu clave privada');

 

Bueno, manos a la obra. Empecemos con el módulo de creación de cuentas.

 

Vamos a crear el archivo (o modificar si ya está creado) /override/Controllers/AuthController.php

El código de este archivo será:

 

//Google recapthca
require_once(dirname(__FILE__) . '/../../tools/reCaptcha/recaptchalib.php');

class AuthController extends AuthControllerCore {

/**
 * Sobreescritura del método displayContent para añadir la muestra del bloque recaptcha
 */
public function displayContent() {
	$this->processAddressFormat();
	$publickey = _GOOGLE_RECAPTCHA_PUBLIC_KEY;
	$htmlCaptcha = recaptcha_get_html($publickey);

	self::$smarty->assign('htmlCaptcha', $htmlCaptcha);
	parent::displayContent();
}

/**
 * Sobreescritura del método preprocess para añadir la comprobación del código captcha
 */
public function preProcess() {
	//Si vamos a realizar el proceso de crear una cuenta, tenemos que comprobar el campo captcha
	if (Tools::isSubmit('submitAccount') OR Tools::isSubmit('submitGuestAccount')) {
		$privatekey = _GOOGLE_RECAPTCHA_PRIVATE_KEY;
		$resp = recaptcha_check_answer($privatekey, $_SERVER["REMOTE_ADDR"], $_POST["recaptcha_challenge_field"], $_POST["recaptcha_response_field"]);

		if (!$resp->is_valid) {
			// What happens when the CAPTCHA was entered incorrectly
			$this->errors[] = Tools::displayError("The reCAPTCHA wasn't entered correctly. Please try it again.");
		}
	}

	parent::preProcess();
}

}

 

Explicación:

Creamos la clase AuthController, que extenderá de la clase situada en la carpeta Controllers AuthControllerCore. Como podemos ver, lo primero es incluir la clase recaptchalib.

El primer método, displayContent, es el que sirve para mostrar el contenido del módulo, osea, el que escribe el código html. Aquí llamaremos al método recaptcha_get_html, pasándole nuestra clave pública. A continuación asignamos el html a la plantilla de smarty (la veremos a continuación) y llamamos al funcionamiento del mismo método en la clase padre.

 

El método preProcess será el encargado de comprobar si el usuario ha introducido las palabras correctamente. Lo primero es comprobar si la acción que se está realizando es el envío (este método sirve para más cosas). Si realmente es así, llamamos al método recaptcha_check_answer, y le pasamos los parámetros tal y como está aquí (este código está copiado de la documentación de Google). Si la respuesta es incorrecta, añadiremos un elemento al array de errores para que la página muestre el error y el formulario no se envíe (aquí es donde falla el módulo de contacto). Una vez hecha esta comprobación, sea válida la respuesta o no, llamamos al método preProcess de la clase padre, que realizará las validaciones del resto de campos.

 

Ahora veamos los cambios que hay que realizar en la plantilla. El archivo de plantilla es /themes/TUTEMA/authentication.tpl. Nos vamos casi al final del archivo (en realidad puedes ponerlo donde te parezca, aunque este es un buen lugar) y añadimos las siguientes líneas en rojo:

 

 

<fieldset class="account_creation dni">

....... //lo que sea

</fieldset>

<fieldset class="account_creation">

<h3>{l s='Captcha text'}</h3>

{$htmlCaptcha}

</fieldset>

{$HOOK_CREATE_ACCOUNT_FORM}

 

 

Ya sólo nos falta una cosa, las traducciones. Como véis, he llamado a la cadena Captcha text. Esto se buscará en el archivo /themes/TUTEMA/lang/en.php. Pues nos vamos a este fichero, y buscamos las líneas que empiecen por $_LANG['authentication_..... Aquí es donde añadiremos una nueva línea, que será

 

$_LANG['authentication_4ccd91a6844efd43155e173e55d53916'] = 'Captcha text';

 

Ahora, nos vamos al fichero /themes/TUTEMA/lang/es.php y añadimos la línea:

 

$_LANG['authentication_4ccd91a6844efd43155e173e55d53916'] = 'Pregunta de seguridad';

 

Como vemos, el código md5 que está al lado de authentication debe ser el mismo.

 

Con esto, ya disponemos de seguridad captcha en nuestro formulario de creación de cuentas. Como veo que el post se está haciendo demasiado largo, voy a publicar otro mensaje con el método de contacto.

Edited by soy.amarillo (see edit history)
  • Like 1

Share this post


Link to post
Share on other sites

La comunidad de prestashop, te agradece tu colaboración.

 

Un saludo

Share this post


Link to post
Share on other sites

Hola soy.amarillo, estoy intentando poner el recaptcha en el formulario create-account_form y no lo consigo. Mi versión de prestashop es la 1.5.3

 

He seguido los pasos que me indicas pero no se si hago algo mal.

Share this post


Link to post
Share on other sites

A mi tampoco me aparece nada y he seguido cada uno de los pasos. Gracias!

Share this post


Link to post
Share on other sites
Guest
This topic is now closed to further replies.

×
×
  • Create New...

Important Information

Cookies ensure the smooth running of our services. Using these, you accept the use of cookies. Learn More