Programación Web: Gestión de cookies
Las “cookies” son archivos compuestos por pares de clave-valor que se guardan en el ordenador cuando se visita una web y que permiten recordar datos proporcionados por el usuario como el usuario y contraseña o las configuraciones personales de esa página web.
1. Cookies en Javascript
- Creación y acceso a las cookies con Javascript
- Creación de la “cookie”:
- Opción 1:
document.cookie = "username=John Doe; expires=Thu, 18 Dec 2013 12:00:00 UTC; path=/";
- Opción 2:
function setCookie(cname, cvalue, expdays) { var d = new Date(); d.setTime(d.getTime() + (expdays*24*60*60*1000)); var expires = "expires="+ d.toUTCString(); document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/"; }
- Acceso a la “cookie”
- Opción 1:
var x = document.cookie;
- Opción 2:
function getCookie(cname) { var name = cname + "="; var decodedCookie =decodeURIComponent(document.cookie); var ca = decodedCookie.split(';'); for(var i = 0; i <ca.length; i++) { var c = ca[i]; while (c.charAt(0) == ' ') { c = c.substring(1); } if (c.indexOf(name) == 0) { return c.substring(name.length, c.length); } } return ""; }
- Borrar una cookie:
- De la misma forma que se crea, definiendo una fecha de expiración anterior a la fecha actual.
2. Cookies en PHP
- Crea la cookie: setcookie('nombre', 'valor');
- Borra la cookie: setcookie('nombre, '', time() - 3600)
3. LocalStorage
- Creación de un objeto:
- localStorage.<> = <>
- localStorage.setItem("clave", "valor")
- Insertando código JSON
- localStorage.test1 = '{"clave":"valor"}'
- Acceder al objeto:
- localStorage.<>
- localStorage.getItem(<>)
- Borrar un objeto:
- localStorage.removeItem(<>)
- Borrar todos los objetos:
- localStorage.clear()
4. IndexedDB
- Añadir o abrir una base de datos:
var request = window.indexedDB.open("NombreBase", <<version>>)
- Comprobar si hay errores:
request.onerror(function(e){...})
request.onsuccess(function(e){...})
- Añadir una tabla:
request.onupgradeneeded = function(e) { var db = e.target.result; var objectStore = db.createObjectStore("Tabla", {keyPath: "id"}); }
- Añadir datos:
var request = db.transaction(["Tabla"], "readwrite").objectStore("Tabla").add({ id: id, name: nombre, age: edad, email: correo });
- Leer dato por id:
var request = db.transaction(["Tabla"], "readwrite").objectStore("Tabla").get(<<id>>) request.onsuccess = function(event){ if(request.result){...} }
- Leer todos los datos:
db.transaction(["Tabla"], "readwrite").objectStore("Tabla").openCursor().onsuccess = function(event){ var item = event.target.result; if(item){ ... item.continue(); } }