Archive for abril, 2010

abril 26, 2010 1

Hacer visible un campo password con jQuery

By in JavaScript, Librerías

Los campos de tipo password no muestran el contenido que tecleamos, evidentemente para evitar que alguien pueda ver nuestras contraseñas. Pero en ocasiones, por ejemplo cuando estamos en casa y no hay nadie cerca, nos puede interesar mostrar el contenido de estos. Usando la librería jQuery podemos hacer esto de forma muy sencilla.

Vamos a ver primero el código de nuestro formulario:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Strict//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
   <head>
      <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
      <title>Login</title>
      <script type="text/javascript" src="jquery-1.4.2.min.js"></script>
      <script type="text/javascript" src="login.js"></script>
   </head>
   <body>
      <form onsubmit="return false;">
         <label for="user">Usuario:</label><input type="text" name="user" id="user"/><br/>
         <label for="password">Password:</label><input type="password" name="password" id="password"/><br/>
         <input type="checkbox" id="show"/> <label for="show">Mostrar password.</label><br/>
         <input type="submit" value="login"/>
      </form>
   </body>
</html>

Es un formulario muy sencillo, ni siquiera envia datos, pero nos sirve como ejemplo. Podemos ver que añadimos dos scripts a la página, el de jQuery y el que contendrá el código para mostrar el campo password. También observamos que hay un campo checkbox que tendremos que seleccionar para ver el contenido de campo password.

Ahora vamos con el código para mostrar el valor del campo, que está en el archivo login.js:

$(document).ready( function(){

   $('#show').attr('checked', false);

   $('#show').click(function(){

      name = $('#password').attr('name');
      value = $('#password').attr('value');
      if($(this).attr('checked'))
      {
         html = '<input type="text" name="'+ name + '" value="' + value + '" id="password"/>';
         $('#password').after(html).remove();
      }
      else
      {
         html = '<input type="password" name="'+ name + '" value="' + value + '" id="password"/>';
         $('#password').after(html).remove();
      }
   });
});

Básicamente lo que hacemos es añadir un evento click al campo checkbox. Cuando se hace click sobre el checkbox este comprueba su valor y sustituye el campo, por otro igual del tipo que corresponda, password cuando no está seleccionando y text cuando lo está, dándole el mismo valor a los atributos de este.

Podéis ver una demo en el siguiente enlace:

Demostración de como hacer visible un campo password con jQuery

Y también podéis descargar los archivos de la demo:

Archivos para hacer visibe un campo password con jQuery

Comparte esta entrada:
Delicious Digg Google Technorati Menéame Fresqui Reddit Facebook Twitter Yahoo! Buzz MySpace Email BarraPunto

Tags: , , ,

abril 21, 2010 0

Sustituido el plugin de resaltado de sintáxis

By in General

Desde hoy, el plugin que se utiliza para resaltar el código es Syntax Highlighter WordPress Plugin. A este plugin, creo que más vistoso que el anterior, se le indica el código de forma distinta. Por este motivo, y porque hoy no podré editar todas las entradas, durante un tiempo ambos convivirán, espero que no por mucho tiempo, hasta que haya actualizado todas las entradas. Perdonen las molestias, espero solo visuales, que esto ocasionará.

Comparte esta entrada:
Delicious Digg Google Technorati Menéame Fresqui Reddit Facebook Twitter Yahoo! Buzz MySpace Email BarraPunto

Tags:

abril 20, 2010 1

Consejos de seguridad en el desarrollo de aplicaciones web

By in General, PHP

La seguridad es un aspecto muy importante al que hay que prestar atención cuando se desarrolla. Es importante tenerla en cuenta desde el mismo comienzo del desarrollo, no dejando la seguridad como algo secundario a realizar en momentos posteriores. Es por esto que vamos a dejar algunos consejos de como mejorar la seguridad durante el desarrollo de nuestras aplicaciones.

No confies en los usuarios

Esta es una de las reglas más importantes. Considera todas los datos que tus usuarios envíen como maliciosos.

$id = intval($_GET['id']);
mysql_query("SELECT username, email, password FROM users WHERE id = $id");

Con una sola linea podemos evitarnos una inyección SQL, por ejemplo.

Validación de datos en el servidor

Es importante realizar la validación de los datos en el servidor. Aunque realicemos también validación en cliente, mediante JavaScript por ejemplo, no hay que olvidarse que es relativamente fácil saltarse esta. Validando los datos en el servidor desde el principio nos evitamos bastantes problemas.

Presta atención a los archivos subidos

Si permites que tus usuarios suban archivos al servidor comprueba estos adecuadamente. Si son imágenes comprueba su tamaño, su tipo MIME, etc, con la función getimagesize. En caso de que sean otro tipo de archivos puedes usar fileinfo (disponible desde la versión 5.3.0) para obtener información de los archivos. Por ejemplo:

Asegura tus formularios contra los bots

Usa algún tipo de captcha para asegurar tus formularios contra bots de spammers. Hay distintas técnicas, puedes implementar uno propio, hacer uso de algún servicio externo o usar una librería de terceros.

Permisos mínimos para el usuario de la base de datos

Da los mínimos permisos al usuario de la base de datos. Si la aplicación solo va a realizar consultas SELECT, INSERT y UPDATE que el usuario de la base de datos solo pueda realizar SELECT, INSERT y UPDATE. No es nada complicado y te puede evitar algún que otro quebradero de cabeza.

Estos consejos son una “traducción” muy libre de estos otros:

http://www.osmialowski.me/blog/web-development-security-tips/

Comparte esta entrada:
Delicious Digg Google Technorati Menéame Fresqui Reddit Facebook Twitter Yahoo! Buzz MySpace Email BarraPunto

Tags: , ,

abril 13, 2010 0

Cheat sheets para todos los gustos

By in General

Navegando por estos mundos de Internet he encontrado una colección de cheat sheets muy interesante. Podemos verlas todas en el siguiente enlace: Cheat Sheets.

Me han parecido muy interesantes las siguientes:

Por supuesto hay muchas más que pueden ser de mucha utilidad mientras se desarrolla.

Comparte esta entrada:
Delicious Digg Google Technorati Menéame Fresqui Reddit Facebook Twitter Yahoo! Buzz MySpace Email BarraPunto

Tags: , , ,