Foros del Web » Programando para Internet » Javascript »

Como relacionar un captcha y validaciones javascript?

Estas en el tema de Como relacionar un captcha y validaciones javascript? en el foro de Javascript en Foros del Web. Saludos cordiales a todos, me gustaría plantear una cuestión. Tengo un formulario de contacto cuyos campos estoy validando con Javascript. Ahora me gustaría también incluir ...
  #1 (permalink)  
Antiguo 09/03/2012, 04:25
 
Fecha de Ingreso: diciembre-2007
Ubicación: Málaga
Mensajes: 155
Antigüedad: 16 años, 3 meses
Puntos: 8
Como relacionar un captcha y validaciones javascript?

Saludos cordiales a todos, me gustaría plantear una cuestión.

Tengo un formulario de contacto cuyos campos estoy validando con Javascript. Ahora me gustaría también incluir un captcha en el formulario. El tema es que no se como relacionar el captcha con la validación en javascript.
Lo tengo planteado de esta manera:

Al hacer click en "enviar" llamo a un archivo js que me valida los campos, si todo está correcto me enviar el formulario. Yo quiero incluir el captcha y que me envie el formulario solo si tanto la validación javascript como la validación php estén correctas. No sé como recoger y evaluar los datos de ambas validaciónes y juntarlas en una función. No sé si me explico... No se como relacionar la validación javascript y la php para enviar el formulario solo si las dos son correctas y cual archivo tiene que llamar al otro, y todas esas cosas, la ruta que sigue toda la validación.

He estado mirando por el foro pero no encontré nada. Si teneis alguna ayuda o algo relacionado agradecería la ayuda.

Muchas gracias.
  #2 (permalink)  
Antiguo 09/03/2012, 09:47
Avatar de maycolalvarez
Colaborador
 
Fecha de Ingreso: julio-2008
Ubicación: Caracas
Mensajes: 12.120
Antigüedad: 15 años, 8 meses
Puntos: 1532
Respuesta: Como relacionar un captcha y validaciones javascript?

lo he dicho miles de veces y mantengo mi posición: es completamente inútil validar un captcha por javascript, dicha validación debe hacerse en el servidor, al igual que siempre se debe validar en el servidor aún cuando la del cliente funcione, validar en el server es lo más seguro
__________________
¡Por favor!: usa el highlight para mostrar código
El que busca, encuentra...
  #3 (permalink)  
Antiguo 09/03/2012, 16:21
 
Fecha de Ingreso: diciembre-2007
Ubicación: Málaga
Mensajes: 155
Antigüedad: 16 años, 3 meses
Puntos: 8
Respuesta: Como relacionar un captcha y validaciones javascript?

Gracias por la respuesta.

Es cierto que he leido algunos post diciendo lo mismo que tu, imagino que algunos de esos post serían tuyos. Parto de la base que soy reciente y recién iniciado en programación y al llegar a ciertos asuntos me hago bastante lio. Después de tu respuesta pues no sé si tengo que quitar la validación por javascript y hacerlo todo por PHP o quitar el captcha y dejar solo el javascript.

Saludos y gracias.
  #4 (permalink)  
Antiguo 09/03/2012, 17:26
Avatar de emprear
Colaborador
 
Fecha de Ingreso: junio-2007
Ubicación: me mudé
Mensajes: 8.388
Antigüedad: 16 años, 9 meses
Puntos: 1567
Respuesta: Como relacionar un captcha y validaciones javascript?

Si ves este ejemplo, quizás te orientes un poco, como el captcha se genera a partir de una sesion de php, la validación se hace con php, sin embargo implementamos javascript para comunicar el resultado al usuario
http://foros.emprear.com/php/captcha/

Aqui algo más avanzado, que si bien la validación sigue siendo en el php, pasamos el form con ajax.
http://foros.emprear.com/php/demo-form-ajax-captcha/
En el caso de deshabilitar js, el form no se procesa
Son todas variantes
SAludos
__________________
La voz de las antenas va, sustituyendo a Dios.
Cuando finalice la mutación, nueva edad media habrá
S.R.
  #5 (permalink)  
Antiguo 10/03/2012, 04:06
 
Fecha de Ingreso: diciembre-2007
Ubicación: Málaga
Mensajes: 155
Antigüedad: 16 años, 3 meses
Puntos: 8
Respuesta: Como relacionar un captcha y validaciones javascript?

Si si te he entendido Emprear muchas gracias. Creo que mas o menos ya sé como enfocarlo y cual es la ruta a seguir. Puedo utilizar el javascript para indicar al usuario que los campos input están correctos o incorrectos y enviar el mensaje solo cuando el captcha sea el correcto. No sé si es exactamente lo que tu querías decir pero mas o menos ya tengo una pequña idea de como podría hacerlo. Ahora solo falta que mis nulos conocimientos en programación me permitan hacerlo.

Muchas gracias de nuevo
  #6 (permalink)  
Antiguo 10/03/2012, 20:32
Avatar de maycolalvarez
Colaborador
 
Fecha de Ingreso: julio-2008
Ubicación: Caracas
Mensajes: 12.120
Antigüedad: 15 años, 8 meses
Puntos: 1532
Respuesta: Como relacionar un captcha y validaciones javascript?

No digo que no use AJAX, lo puedes usar, lo que NO debes hacer es validar el captcha primero y enviar la data después, es decir que puedes hacer todas las validación locales en javascript que quieras y enviar los datos al servidor, allí es donde debes de validar el captcha, no en un paso previo, además de volver a validar los datos en php, es redundante pero más seguro.
__________________
¡Por favor!: usa el highlight para mostrar código
El que busca, encuentra...
  #7 (permalink)  
Antiguo 13/06/2012, 12:01
Avatar de SnakeCode  
Fecha de Ingreso: mayo-2012
Ubicación: Lima - Perú
Mensajes: 23
Antigüedad: 11 años, 11 meses
Puntos: 1
Respuesta: Como relacionar un captcha y validaciones javascript?

Cita:
Iniciado por maycolalvarez Ver Mensaje
No digo que no use AJAX, lo puedes usar, lo que NO debes hacer es validar el captcha primero y enviar la data después, es decir que puedes hacer todas las validación locales en javascript que quieras y enviar los datos al servidor, allí es donde debes de validar el captcha, no en un paso previo, además de volver a validar los datos en php, es redundante pero más seguro.
Hola maycolalvarez, tus respuestas también me sirvieron mucho, pero mi duda viene cuando quiero enviar un un mensaje mediante el método ajax de jquery, como implemento la solución:

Este es mi codigo javascript (jquery):
Código Javascript:
Ver original
  1. $(document).ready(function(){
  2.        
  3.         /************************************* CALENDARIO JQUERY UI ******************************************/
  4.         $("#Fecha").datepicker({
  5.             showOn: 'both',
  6.             buttonImage: 'imagenes/calendario.gif',
  7.             buttonImageOnly: true
  8.         });
  9.         /*****************************************************************************************************************/
  10.        
  11.         /************************************* VALIDACION DE FORMULARIOS ******************************************/
  12.         var correo = /^[a-zA-Z0-9_\.\-]+@[a-zA-Z0-9\-]+\.[a-zA-Z0-9\-\.]+$/;
  13.        
  14.         $("#Submit").click(function(){
  15.        
  16.             $(".error").remove();
  17.  
  18.             if($("#Nombre").val() == ""){
  19.                 $("#Nombre").focus().after('<span class="error">Ingrese su nombre</span>');
  20.                 return false;  
  21.             }else if($("#Pais").val() == ""){
  22.                 $("#Pais").focus().after('<span class="error">Ingrese su pais</span>');
  23.                 return false;
  24.             }else if($("#Correo").val() == "" || !correo.test($("#Correo").val())){
  25.                 $("#Correo").focus().after('<span class="error">Ingrese email valido</span>'); 
  26.                 return false;
  27.             }else if($("#captcha").val() == ""){
  28.                 $("#captcha").focus().after('<br /><span class="error">Ingrese los caracteres de la imagen</span>');
  29.                 return false;
  30.             }else{
  31.                 var datos = "Nombre=" + $("#Nombre").val() +
  32.                         "&Pais=" + $("#Pais").val() +
  33.                         "&Telefono=" + $("#Telefono").val() +
  34.                         "&Correo=" + $("#Correo").val() +
  35.                         "&Sexo=" + $("input[name='Sexo']:checked").val() +
  36.                         "&Edad=" + $("#Edad").val() +
  37.                         "&Permanencia=" + $("#Permanencia").val() +
  38.                         "&Fecha=" + $("#Fecha").val() +
  39.                         "&Encontro=" + $("#Encontro").val() +
  40.                         "&Comentarios=" + $("#Comentarios").val() +
  41.                         "&url=" + $("#url").val();
  42.                        
  43.                 $.ajax({
  44.                     type    : 'POST',
  45.                     url     : 'captcha/c-envio-solicitud-2.php',
  46.                     data    : datos,
  47.                     success : function(){
  48.                                     url='c-gracias-solicitud.htm';
  49.                                     window.location = url; 
  50.                               },
  51.                     error   : function(){
  52.                                     alert("No se pudo enviar el mensaje. ¡Intentelo nuavamente!");
  53.                               }
  54.                 });
  55.                 return false;
  56.             }
  57.         });
  58.        
  59.         $("#Nombre, #Pais, #captcha").keyup(function(){
  60.             if( $(this).val() != "" ){
  61.                 $(".error").fadeOut();
  62.                 return false;
  63.             }
  64.         });
  65.        
  66.         $("#Correo").keyup(function(){
  67.             if( $(this).val() != "" && correo.test($(this).val())){
  68.                 $(".error").fadeOut();
  69.                 return false;
  70.             }
  71.         });
  72.         /*****************************************************************************************************************/
  73.        
  74.         /************************************ REFRESCAR CAPTCHA **************************************************************/
  75.         $('img#refresh').click(function() {  
  76.               change_captcha();
  77.         });
  78.        
  79.         function change_captcha(){
  80.           document.getElementById('im_captcha').src="captcha/get_captcha.php?rnd=" + Math.random();
  81.         }
  82.         /********************************************************************************************************************/
  83. });

Este es el codigo php (aca es donde tengo q hacer la validacion del captcha):
Código PHP:
<?php
    session_start
();
    include(
"geoiploc.php");
    
$direccion_ip $_SERVER['REMOTE_ADDR']; 
    
$ipcliente.=" ".$direccion_ip;
    
$paiscliente=getCountryFromIP($direccion_ip" NamE ");
    
    
#correos destino===================================================================================
        
$email_principal     '[email protected]';
        
$email_secundarios     '[email protected]';
    
#==================================================================================================
    
    
$eol="\r\n";
    
#Cuerpo del mensaje===============================================================================
        
$message_send "Mensaje desde la página<br /><br />      
        IP: "
.utf8_decode($ipcliente)." <br />
        País: "
.utf8_decode($paiscliente)." <br />
        Nombre: "
.utf8_decode($_POST['Nombre'])." <br />
        País: "
.utf8_decode($_POST['Pais'])." <br />
        Teléfono: "
.utf8_decode($_POST['Telefono'])." <br />    
        E-mail: "
.utf8_decode($_POST['Correo'])." <br />
        Sexo: "
.utf8_decode($_POST['Sexo'])." <br />
        Edad: "
.utf8_decode($_POST['Edad'])." <br />
        Permanencia: "
.utf8_decode($_POST['Permanencia'])." <br />
        Fecha: "
.utf8_decode($_POST['Fecha'])." <br />
        Donde nos encontro: "
.utf8_decode($_POST['Encontro'])." <br />
        Comentarios: "
.utf8_decode($_POST['Comentarios'])." <br />
        Url: "
.utf8_decode($_POST['url'])." <br />";
    
#================================================================================================
    
    #Cabeceras para evitar el SPAM===================================================================
        
$headers .= 'From: '.utf8_decode($_POST['Nombre']).'<'.utf8_decode($_POST['Correo']).'>'.$eol;
        
$headers .= "CC: ".$email_secundarios.$eol;
        
$headers .= "Reply-To: ".$mail."".$eol;
        
$headers .= "Return-Path: ".$mail."".$eol;
        
$headers .= "Message-ID: <".time()."-".$para.">".$eol;
        
$headers .= "X-Mailer: PHP v".phpversion().$eol;
        
$headers .= "MIME-Version: 1.0".$eol;
        
$headers .= "Content-type: text/html; charset=iso-8859-1;".$eol.$eol;
    
#================================================================================================
    
    #Enviar mensaje===================================================================================
        
mail($email_principal'INFO-C VIVA' $message_send$headers)
    
#=================================================================================================
?>
Como tendría que hacer para que cuando no este bien escrito el captcha, mande un mensaje al formulario o si esta bien llege a enviar, he estado intentandolo pero no funciona. Gracias de antemano!!

Saludos

Etiquetas: captcha, formulario, js, php, relacionar, validar
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 23:27.