You are here
COOKIES Y JAVASCRIPT Sin categoría 

COOKIES Y JAVASCRIPT

COOKIES Y JAVASCRIPT

 

Las cookies son pequeños paquetes de información enviadas por las webs que visitas y que el navegador almacena en el pc del usuario. Son útiles para guardar preferencias del usuario u otros datos referentes a usuarios en particular.

 

¿QUÉ INFORMACIÓN SE PUEDE ALMACENAR EN UNA COOKIE?

 

Se puede almacenar una alta variedad de información. Esta información se almacena en cadenas de texto en la forma variable=valor. Has de tener en cuenta que todas estas variables van en una sola cadena de texto no más de 4KB y cada par variable/valor se separa de la siguiente por un ; de la siguiente forma:

 

“estilo=rojo; max-age=40; path=/; domain=efxto.com”

 

Analizemos el código que he escrito. max-age, path y domain son nombres de variables reservados pues son leidos por el navegador para controlar información como la vida útil de la cookie o la web para la que es válida. La variable estilo es la que yo he introducido y cuyo valor va a ser el estilo seleccionado por el usario para que sea el mismo  cuando  vuelva  a  mi  página.  Puedes  crear  la  variable  que  quieras  y  darle cualquier valor que desees, con las siguientes particularidades:

 

max-age

 

Por defecto toda cookie tiene una vida útil de la sesión del navegador, en otras palabras, cuando cierras el navegador la cookie desaparece. La variable max-age puede alterar  este  valor  por  defecto  para hacer  que  sea válida  durante más  tiempo.  Para especificar el tiempo que la cookie será válida simplemente dale el valor de tiempo que quieras a la variable max-age siempre expresado en segundos.

 

Por ejemplo, si queremos que la cookie sea válida por 60 días pondremos: “estilo=rojo; max-age=51840000; path=/; domain=”bloogie.es”

Actualmente la mayoría de navegadores admiten otra forma en la que no es necesario calcular los segundos: (60 segundos por 60 mintuos por 24 horas * 60 días):

 

“estilo=rojo; max-age=” +60*60*24*60 + ; path=/; domain=”bloogie.es”

 

path

 

 

Toda cookie es válida por defecto sólo para las páginas en el directorio de la

 

página   actual   e   inferiores.   Es   decir,   si   la   página   http://dominio.com/seccion-

 

 

1/articulo3.html envía una cookie, esta será válida también para todas las páginas bajo http://dominio.com/seccion-1/ y para páginas inferiores como por ejemplo http://dominio.com/seccion-1/categoria-3/articulo4.html  pero  no  para http://dominio.com o http://dominio.com/seccion-2.

 

A través de la variable path se puede alterar este valor por defecto. Por ejemplo si quieres que la cookie sea válida para todo tu sitio le daremos el valor “/” a la variable path, o si queremos que sea válida para un determinado directorio le daremos el valor “/directorio”.

 

domain

 

Con esta variable podemos especificar sub-dominios para los que la cookie es válida,  he  dicho  subdominios  porque  si  tu  sitio  es  dominio.com,  el  navegador  no aceptará cookies para otrodominio.com o facebook.com. Lo que podemos hacer con la variable domain es decirle al navegador si la cookie es válida solo para el domino principal   (domain=www.dominio.com),   para   el   dominio   principal   y   para   los subdominios (domain=dominio.com) o para un subdominio concreto (domain=subdominio.dominio.com),

 

secure

 

Esta variable no debe ser especificada a menos que quieras que la cookie sea enviada sólo si el usuario está visitando tu web a través de una conexión segura.

 

expires

 

Esta es una variable depreciada aunque aún sea soportada por los navegadores. La variable max-age es la que reemplaza a expires. Sin embargo ten encuenta que no debes usar el nombre “expires” para almacenar tu información.

 

No pongas espacios, comas o semi-colons en el valor de las variables

 

El valor de las variables de una cookie no puede contener espacios en blanco, comas  o  putno  y  comas  (semi-colons).  Si  inevitablemente  tienes  que  usar  estos caracteres debes codificarlos. Entre los métodos que puedes usar el más fácil es encodeURIComponent() para codificar y decodeURIComponent() para decodificar cuando leas la cookie. Por ejemplo:

 

“estilo=” + encondeURIComponent(“estilo rojo”) + “; max-age=” + 60*60*24*60 +”;

path=”/”; domain=bloogie.es”

 

LÍMITES DE USO DE COOKIES

 

Cada navegador puede tener implementado límites difrentes para las cookies pero los estándares mínimos que debe tener son:

 

Longitud de la cookie: 4KB. Todas las variables, incluyendo las especiales, no deben tener más de 4.096 caracteres.

 

20 cookies como máximo por web.

 

300 cookies almacenadas como máximo, incluyendo cookies enviadas por otros sitios web.

 

COMO ENVIAR UNA COOKIE CON JAVASCRIPT

 

Enviar  una  cookie  es  bastante  simple,  sólo  necesitas  darle  a  la  propiedad document.cookie el valor de la cadena de texto con las variables de tu cookie:

 

document.cookie=”estilo=”  +  encondeURIComponent(“estilo  rojo”  +”;  max-age=”  +

60*60*24*60 +”; path=/; domain=bloogie.es”; La siguiente función facilita algo el trabajo:

function                                                                                                        enviar_cookie

(nombre_cookie,valor_cookie,vida_cookie_dias,dominio_cookie){

document.cookie = nombre_cookie +

“=” + encodeURIComponent( valor_cookie ) + “; max-age=” + 60 * 60 *

24 * vida_cookie_dias +

“; path=/; domain=” + dominio_cookie ;

}

 

 

Para establecer la cookie ahora solo tienes que llamar la función desde la parte de una página que quieras mediante una expresión que para nuestro ejemplo sería:

 

enviar_cookie(“estilo”,”color rojo”,”60″,”bloogie.es”);

 

COMO LEER UNA COOKIE

 

En este punto ya hemos enviado una cookie, pero no nos servirá de nada si no la leemos cuando el usuario visite nuestra página.

 

Lo primero será comprobar si la cookie existe, esto si la hemos enviado  y permanece guardada en el navegador. Una vez obtenida la leeremos como lo que és, una cadena de texto en busca de los parámetros que nos interesen. En nuestro ejemplo el parámetro que nos interesa es el nombre de la cookie y su valor, es decir, que valor tiene el parámetro que hemos introducido llamado “estilo”. Para hacer esto podemos usar expresiones regulares o funciones javascript como split para separar la cadena de texto en  varias  partes  y  buscar  una  subcadena.  Para  nuestro  ejemplo  se  podría  usar  la siguiente función:

 

function get_cookie ( nombre_cookie ){

if (document.cookie.length != 0) {

var valor_cookie = docuemnt.cookie.match (

‘(^|;)[\s]*’ +

nombre_cookie +

‘=([^;]*)’ );

return decodeURIComponent ( valor_cookie[2] ) ;

}

return ” ;

}

 

Para obtener el estilo seleccionado por el usuario previamente y establecido en la cookie que enviamos utilizaremos:

 

estilo_usuario = get_cookie(“estilo”);

 

COMO BORRAR UNA COOKIE

 

Alguna vez puede que necesites borrar una cookie enviada con anterioridad. Para hacer esto envía una cookie con max-age=0 para el mismo path y domain, dejando el parámetro que deseas eliminar con valor nulo (en nuestro caso el parámetro estilo). La función anterior que usamos para enviar la cookie dejaba el path=/, para borrar esta cookie podríamos usar esta función:

 

function borrar_cookie ( nombre_cookie, dominio_cookie ){

document.cookie   =   nombre_cookie   +   “=”;   max-age=0;   path=/;   domain=”   +

dominio_cookie ;

}

Llamaremos a la función con:

 

borrar_cookie(“estilo”,”bloogie.es”);


Si quieres seguir aprendiendo con nosotros, puedes ingresar a nuestros

Cursos y Diplomados de Tecnología Web visita www.uneweb.edu.ve  para más información

 

Related posts