Cookie – Añadir, leer y borrar cookies con JQuery

Lo primero que vamos ha hacer es definir que es una cookie: «Una cookie, galleta o galleta informática es una pequeña información enviada por un sitio web y almacenada en el navegador del usuario, de manera que el sitio web puede consultar esta información».

Nos sirve para poder dejar en el ordenador del usuario cierta información, para luego desde la pagina web poder recuperar esta información.

Tenemos que incluir en nuestra pagina un pluggin de javascript para poder utilizarlo, no esta en jquery basico, este javascript es JQuery Cookie lo puedes descargar aquí.

código para añadir una cookie:


$.cookie('nombre_cookie','valor',{path: '/' }); // path donde dejar la cookie
$.cookie('nombre_cookie','valor', { expires: 7 }); // con fecha de expiración a los 7 dias
$.cookie('nombre_cookie','valor', { path: '/', expires: 7 }); // con fecha de expiración a los 7 dias y path

es muy importante ponerle el path donde queremos dejar la cookie, pues si la vamos a leer desde distintas paginas de nuestra pagina web, si estas estan en distintos path, no la podremos leer, lo mas conveniente es dejarlas en el raiz de nuestra web.

código para leer una cookie:


var texto = $.cookie('nombre_cookie');

codigo para borrar una cookie:


$.removeCookie('nombre_cookie');

No olvides de añadir el fichero .js a tu pagina web, ademas de jquery.

Existe una extension de Chrome muy util para poder ver las cookies en el sitio en el que estas, se llama EditThisCookie aqui te dejo el enlace : https://chrome.google.com/webstore/detail/editthiscookie

editcookie

Esta extensión nos crea un icono en la barra de tareas para poder ver las cookies que tenemos en esa pagina, es muy facil de usar y muy practico.