lunes, 20 de enero de 2014

VALIDACIÓN DE FORMULARIOS


En toda aplicación web es importante la seguridad, tanto del propio sistema (que no produzca errores por sí mismo) como ataques contra de usuarios. Además es importante para muchos internautas que no se le permita el almacenamiento de otro tipo de datos a los que le solicitan, ejemplo si solicitan la edad, solo debería ser permitido ingresar números.
La seguridad con los tipos de datos se logra a varios niveles. Primeramente, en el diseño de la base de datos, donde se debe ajustar cada tipo de dato a lo que realmente se necesita. Una vez establecido esto, se deben validar los datos de entrada de usuarios para que coincidan con los de la base de datos, evitando así dos cosas, primero, el mensaje de error de base de datos, que como no supimos capturar nos sale de momento y rompe con todo nuestro diseño; y segundo, mantener la integridad de nuestra base de datos.

De nuestro estudio la validación se la hará en el diseño de vistas, particularmente en el controlador de esa vista. Hay maneras de evitar que el usuario escriba “sí”, “si”, “Sí”, “SI”, “s”, “yes”, “y”, etc. Se debe indicar qué datos del formulario son obligatorios (suele usarse un asterisco), y de qué tipo son.
Queda entonces validar que no entren campos vacíos, y que los entrados sean válidos (números, fechas, direcciones web, direcciones http, etc.). Es pertinente validar los datos del lado del cliente (PC donde está el usuario), es decir, usando javascript (una opción de moda es el jquery validate). Esta validación en el cliente permite que el usuario conozca sus errores antes de hacer el envío o submit de la página, lo que permite además conservar sin mucho trabajo los datos entrados en los componentes visuales.
Pero como hay diversos navegadores en los que las cosas se comportan a veces de formas diferentes, y porque el usuario puede tener deshabilitado el javascript, es necesario validar los datos también en el lado del servidor: el php no depende de qué navegador se esté usando en los clientes, por lo que estamos trabajando en un entorno más controlado.

CodeIgniter brinda una excelente aproximación a la validación de datos, con la clase de validación de formularios. Esta clase permite especificar las reglas que le vas a aplicar a los datos enviados desde el cliente, así como los mensajes de error para cada una. Además permite especificar los delimitadores que le darán formato al mensaje, y da la posibilidad de mostrar los errores nuevamente en el cliente.


Ejemplo vamos a validar los siguientes campos del logueo del Usuario a la aplicaciòn agenda

Vista de Logueo de agenda

Antes de proceder con la codificación de la función de validación y sus respectivos mensajes es importante conocer la estructura de la clase form_validation


Establecer reglas de validación
CodeIgniter permite configurar todas las reglas de validación que necesite para un campo Determinado, en cascada en orden, y que incluso le permite PrEP y pre-procesar los datos de campo al mismo tiempo. Para definir las reglas de validación que va a utilizar los () set_rules función:
$ This-> form_validation-> set_rules ();
La función anterior toma tres parámetros como entrada:
  1. El nombre del campo - el nombre exacto que se le ha dado el campo de formulario, básicamente es el name del elemento del formulario.
  2. Un nombre entendible para el usuario (una leyenda) para este campo, que se insertará en el mensaje de error. Por ejemplo, si el campo se llama "usuario" que podría darle un nombre humano de "nombre de usuario". 
  3. La validación de las reglas para este campo de formulario.


En el controlador se debe añadir el siguiente código:
class Login extends CI_Controller {

function validaForm(){
$this->form_validation->set_rules('usuario', 'Usuario', 'required|min_length[4]
           |max_length[25]|trim|alpha_dash');
$this->form_validation->set_rules('clave', 'Clave', 'required|min_length[4]
           |trim|max_length[25]');

   $this->form_validation->set_message('required','Debe introducir el campo %s');
$this->form_validation->set_message('min_length','El campo %s debe ser igual menos %d caracteres');
$this->form_validation->set_message('max_length','El campo %s debe ser menor que %d caracteres');
   $this->form_validation->set_message('alpha_dash','%s solo contiene numeros, letras y guiones alto y bajo');
if ($this->form_validation->run() == FALSE){
return FALSE;
}else{
return TRUE;
}
}
}



Con esta función se ha validado los campos Usuario y Contraseña de la vista Logueo, de forma general se ha especificado que ambos campos son requeridos (required), el valor mínimo que se puede ingresar es de 4 caracteres y el máximo de 25, así mismo en el campo usuario sólo decimos que son admisibles números, letras y guiones altos y bajos.



Referencias de Reglas

Reglas nativas de CodeIgniter

OTROS ASISTENTES

ASISTENTE DE HTML

El archivo Asistente de HTML contiene funciones que asisten en el trabajo con HTML.

CARGANDO EL ASISTENTE
  1. Puede ser cargado desde el archivo de configuración general: home/acer/public_html/Agenda/application/config/ autoload.php

    De nuestra aplicación agenda, tenemos en un array a los siguientes asistentes:
    $autoload['helper'] = array('url','form','text','date','security','html','file','download','smiley','string');
  2. Puede ser cargado en el propio controlador con:  $this->load->helper('html');

FUNCIONES DISPONIBLES

  • Etiqueta de salto de línea <br>, recibe como parámetro el numero de veces que se repite la etiqueta
    br()

    echo br(3);

  • Etiqueta de encabezado <h1>, recibe como paràmetro el tamaño del encabezado
    heading()

    Recibe como parámetros el título del encabezado y el tamaño.

    echo heading('Welcome!', 3);

  • Crear etiqueta <img>
    img()

    echo img('imagenes/fondo.jpg');

    Tiene como parámetro la dorecciòn o "href" de la ubicación de la imagen


  • Crear etiquetas <link>
    link_tag()
    $link = array( 'href' => 'estilos/contacto.css', 'rel' => 'stylesheet',  'type' => 'text/css', )
    echo link_tag($link);

    Útil para los enlaces de hojas de estilo, así como para otros enlaces. Los parámetros son href, como opcional rel, type, title, media e index_page. index_page es un valor TRUE/FALSE que especifica si el href debería haber sido especificado por la página de $config['index_page'] agregado a la dirección que creo. echo link_tag('css/mystyles.css');


        ASISTENTE DE SEGURIDAD
El archivo Asistente de Seguridad contiene funciones relacionadas con seguridad.

CARGANDO EL ASISTENTE
  1. Puede ser cargado desde el archivo de configuración general: home/acer/public_html/Agenda/application/config/ autoload.php

    De nuestra aplicación agenda, tenemos en un array a los siguientes asistentes:
    $autoload['helper'] = array('url','form','text','date','security','html','file','download','smiley','string');
  2. Puede ser cargado en el propio controlador con:  $this->load->helper('security');

FUNCIONES DISPONIBLES

  • Filtrado contra ataques XSS (Cross Site Script)
    xss-clean();

    En nuestra aplicación la hemos utilizado dentro de los validadores de los elementos de formulario.

    $this->form_validation->set_rules('usuario', 'Usuario', 'required|xss_clean');


  • Encriptaciones de una vía SHA1 (por defecto) o MD5 aptas para encriptar contraseñas. 
  • dohash() 

    $cadena = dohash($cadena); // SHA1
    $cadena = dohash($cadena, 'md5'); // MD5


  • Eliminará las etiquetas de imagen de una cadena. Deja la URL de la imagen como texto plano.
    strip_image_tags()

    $cadena = strip_image_tags($cadena);

  • Convierte etiquetas PHP a entidades
    encode_php_tags()

    $cadena = encode_php_tags($cadena);

ASISTENTE DE FORMULARIOS

El archivo Asistente de Formulario contiene funciones que asisten al trabajo con formularios.

CARGANDO EL ASISTENTE
  1. Puede ser cargado desde el archivo de configuración general: home/acer/public_html/Agenda/application/config/ autoload.php

    De nuestra aplicación agenda, tenemos en un array a los siguientes asistentes:
    $autoload['helper'] = array('url','form','text','date','security','html','file','download','smiley','string');
Puede ser cargado en el propio controlador con:  $this->load->helper('form');


FUNCIONES DISPONIBLES
  • Elemento de Apertura de Formularios: <form>
    form_open()

    El principal beneficio de usar esta etiqueta en vez de hardcodear su propio HTML es que permite que su sitio sea más portable en caso de que sus URLs cambien alguna vez.

    Ejemplo: 
    echo form_open('contacto/agregarUsuarioBD');

    Donde:
    login, corresponde al nombre del controlador al cual se le enviará por post todos los elementos del formulario
    validarLogin, corresponde al nombre de la función que se encuentra dentro del controlador login

    Agregando atributos
    Los atributos pueden ser agregados pasando un arreglo asociativo como segundo
    parámetro, así:

    $formularioCaracteristicas = array( 'class' =>'form-horizontal',  'role' =>'form' );
    echo form_open('contacto/agregarUsuarioBD',$formularioCaracteristicas);


  • Elemento de Cierre de Formularios: </form>
    form_close()

    La única ventaja de usar esta función es que permite pasar datos que serán agregados debajo de la etiqueta.
    $cadena = "</div></div>";
    echo form_close($cadena);


  • Elemento de Formularios para subir archivos:
    form_open_multipart()
    Esta función es idéntica a la etiqueta form_open(), excepto que agrega el atributo multipart, el cual es necesario si desea usar el formulario para subir archivos.

  • Elemento de Formularios de entrada de texto, similar a <input type="text"/>
    form_input()

    Puede pasar minimamente el nombre del campo y el valor en el primer y segundo parámetro:
    echo form_input('nombres', 'Maria');

    O se puede pasar un arreglo asociativo como segundo parámetro. (De nuestro estudio es más útil para la aplicación agenda)

    $nombres = array(  ''name' =>'nombres', 'id' =>'nombres', 'class' =>'form-control',
    'placeholder' =>'Ingrese sus dos primeros nombres...', 'autofocus'=>'TRUE', 'required'=>'True', 'size' =>'20');

    echo form_input($nombres);

  • Elemento de Formularios de contraseñas, similar a <input type="password"/>
    form_password()

    Con este tipo de formulario a diferencia del anterior que recibe caracteres y los muestra. La entrada de los datos son vistas como ****. (Vamos a enviarle las propiedades de este elemento como un array asociativo)
    $password = array( 'name' =>'clave', 'id' =>'clave', 'class' =>'form-control',
                    'placeholder' =>'Ingrese su contraseña...', 'required'=>'True', );

    echo form_password($password);


  • Elemento de Formulario para subir archivos, similar a <input type="file"/>
    form_upload()
    $foto = array(  'name' =>'foto', 'id' =>'foto', 'class' =>'form-control');
    echo form_upload($foto);

  • Elemento de Formulario que nos permite escribir texto en mas de una linea, similar a la caja de texto multilínea <textarea name="comentario" rows="4" cols="50"> **** </textareas>
    form_textarea()

    Es necesario que tenga como atributos el número de "rows" y "cols".

    $comentario=array( 'name' =>'comentario', 'id' =>'comentario', 'rows'=>'4',
    'class' =>'form-control',  'cols'=>'5', 'style'=>'background:pink', 'align'=>'center' );

    echo form_textarea($comentario);

  • Elemento de Formulario que permite crear un menú desplegable estándard, similar a los cuadros de selección <select name="opciones"> <option> Estudiante </option><option> Docente </option> </select>
    form_dropdown()
    El primer parámetro contendrá el nombre del campo, el segundo parámetro contendrá un arreglo asociativo de opciones, y el tercer parámetro contendrá el valor que desea sea preseleccionado.

    $estadoCivil = array('soltero'=>'Soltero','casado'=>'Casado');
    echo form_dropdown('estado_civil',$estadoCivil);

  • Elemento de Formularios para casillas de verificación, similar a <input type="checkbox" name="intereses" value="solterio"> Soltero
    form_checkbox()

    $datos = array( 'name' => 'cerrarCuenta', 'id' => 'cerrarCuenta', 'value' => 'aceptar',
                  'checked' => TRUE, 'style' => 'margin:10px', );

    echo form_checkbox($datos).'  Cerrar Cuenta';

  • Elemento de Formularios para radio (selección única de un conjunto de opciones), similar  a  los botones de selección <input type="radio" name="genero" value="F"  checked >Femenino
    <input type="radio" name="genero" value="M> Masculino 
    form_radio()

    echo form_radio('genero','1','true').'Femenino';
    echo form_radio('genero','2').'Másculino'.'<br>';

  • Elemento de Formulario para generar un botón de envío, similar a <input type="submt"/>
    form_submit()

    echo form_submit('guardar','Guardar');

    Donde:
    El primer parámetro (guardar) corresponde al name del botón
    El segundo parámetro (Guardar) es el valor de dicho botón.

  • Elemento de Formulario para crear un botón de reestablecer
    form_reset()

    echo form_reset($boton, 'Reestablecer los datos iniciales');

    Donde:
    El primer parámetro (guardar) corresponde al name del botón
    El segundo parámetro (Guardar) es el valor de dicho botón.


  • Elemento de Formulario para crear un label, similar a <label>
    form_label()
    $atributos = array( 'class' => 'col-lg-2 control-label', 'style' => 'color: #000;', );
    echo form_label('Cual es tu nombre', 'nombre', $atributos);

    Donde: 
    El primer parámetro es el texto que mostrará el label
    El segundo parámetro es el id de la etiqueta
    El tercer parámetro (opcional) son los atributos que le afectará al elemento.