Encriptación MD5 en JavaScript + Google Docs

En mi último artículo revisamos la encriptación MD5 en PHP, ahora vamos a ver como realizarla en JavaScript, un ejemplo de un encriptador y como un pequeño bonus: cómo hacerla funcionar con Google Docs.

1. El Código
2. Ejemplo de Encriptador MD5
3. Ejemplo con Google Docs

1. El Código

A diferencia de PHP en JavaScript no existe una función predefinida por lo cual debemos elaborar todo el código. Actualmente hay muchas implementaciones, siendo una de las más confiables la de Paul Johnston de pajhome.org.uk razón por la cual nos vamos a apoyar en ésta para la encriptación MD5.

<!-- Llamamos el script de encriptación MD5 desde la página de Paul Johnston -->
<script src="http://pajhome.org.uk/crypt/md5/2.2/md5-min.js"></script>

<!-- La encriptación se da a través de la función hex_md5() -->
<script type="text/javascript">
	md5string = hex_md5("cadena a convertir");
</script>

Para más información sobre la implementación MD5 de Paul Johnston por favor visita su site en: pajhome.org.uk/crypt/md5/.

2. Ejemplo de Encriptador MD5

Siguiendo la estructura de mi post anterior, a continuación dejo el demo y código fuente de un encriptador MD5 en JavaScript.

DEMO: ¿Quieres ver cómo quedaría?

<html>
<head>

<!-- Llamamos el script de encriptación MD5 desde la página de Paul Johnston -->
<script src="http://pajhome.org.uk/crypt/md5/2.2/md5-min.js"></script>

<!-- Función para convertir la cadena a MD5 e imprimirla -->
<script type="text/javascript">
function calcMD5(){
	document.getElementById('md5string').value = hex_md5(document.getElementById('string').value);
}
</script>

</head>
<body>

<div align="center" style="width:600px;">

<h1> Encriptador MD5 en JavaScript </h1>

<!-- Formulario que llama a la función de conversión MD5 -->
<form method="post" action="javascript:calcMD5();">
	<textarea id="string" style="width:49%; height:40px; float:left;"></textarea>
	<textarea id="md5string" disabled="disabled" style="width:49%; height:40px; float:right;"></textarea>
	<br />
	<input type="submit" value="Encriptar">
</form>

<a href="http://paulvazo.com/blog/2011/04/encriptacion-md5-en-javascript-google-docs/" target="_blank">[ ver el código fuente ]</a>

</div>

</body>
</html>

3. Ejemplo con Google Docs

¡Tema de extrema curiosidad! Encriptación MD5 con Google Docs (Servicio de ofimática como MS Office pero Libre y Online).
Esto es posible gracias a que Google Docs nos permite crear nuestras propias funciones en JavaScript.

DEMO: ¿Quieres ver cómo quedaría?

  1. Primero nos dirigimos a Google Docs y nos logueamos, de no tener cuenta nos creamos una, que de todas maneras nos va a servir para todos los servicios ofrecidos por Google.

  2. Luego nos dirigimos al menú de la izquierda debajo del logo de Google y seleccionamos Crear nuevo > Hoja de cálculo.

    38_01

  3. Ahora ya nos encontramos dentro de nuestra hoja de cálculo (básicamente es MS Excel), aquí nos ubicamos en el menú superior y seleccionamos Herramientas > Editor de secuencia de comandos, nos va a aparecer una ventana nueva.

    38_02

  4. La ventana que nos acaba de aparecer es en donde podemos crear y editar funciones personalizadas para utilizarlas en nuestra hoja de cálculo. Aquí pegamos el script de encriptación MD5 y luego guardamos (Ctrl + S).

    IMPORTANTE: Para este ejemplo utilicé la version 1.1 de la implementación de Paul Johnston que puedes conseguir aquí: JavaScript MD5 1.1 ya que la versión actual mandaba un error en Google Docs.

    38_03

  5. Finalmente nos dirigimos a nuestra hoja de cálculo y utilizamos el script de encriptación con el comando calcMD5(), el cual funciona igual que cualquier otro comando como SUM o MULTIPLY, es decir nos ubicamos en cualquier celda y escribimos por ejemplo: =calcMD5(A1) con este comando vamos a convertir el contenido de la celda A1 a MD5.

    IMPORTANTE: Para conversión a MD5 es necesario que el campo a convertir sea un Texto Plano. Si la celda contiene sólo números nos va a dar como resultado la misma cadena MD5 como si la celda estuviera vacía. Para solucionar esto seleccionamos la celda, nos dirigimos al menú y seleccionamos Formato > Número > Texto normal.

4 Comments

  1. Javier_Campos

    Estoy utilizando el md5.js, funciona bien, pero cada que hago referencia a este script me genera un log de error: [06-Jun-2011 16:13:20] PHP Warning:  PHP Startup: Unable to load dynamic library ‘/usr/local/lib/php/extensions/no-debug-zts-20060613/ixed.5.2ts.lin’ – /usr/local/lib/php/extensions/no-debug-zts-20060613/ixed.5.2ts.lin: undefined symbol: executor_globals_id in Unknown on line 0

    A qué se deberá este error?

    1. Paul Incháustegui

      ¡Hola @Javier_Campos!

      Al parecer ese error se debe a una mala configuración del php.ini; no obstante determinar cual es el error es muy difícil pero no creo que sea por el script ya que el error se genera en el servidor, irónicamente por lo que me dices parece que el script sí saca el error a la luz.

      Podrías probar reinstalando plugins, php mismo o si fuera hosteado contactar al administrador por soporte técnico.

      Personalmente te recomendaría encriptar directamente en PHP ya que tiene una función predefinida para ello.

    1. Paul Incháustegui

      ¡Hola @luis! Desafortunadamente no se puede desencriptar el contenido una vez encriptado debido a que MD5 es un algoritmo sólo de ida.

      Para validar cadenas (por ejemplo contraseñas) tenemos que encriptarlas y compararlas en su estado MD5.

Agregue un comentario a luis Cancelar respuesta

Su dirección de correo no se hará público. Los campos requeridos están marcados *

No soy un robot *