Què són les cookies
Una cookie és un element que permet emmagatzemar
informació a l'ordinador client que perduri i estigui disponible
en altres sessions. Així doncs, podríem emmagatzemar dades
com el nom de l'usuari, l'última data que va connectar-se, el nom
del seu navegador, les vegades que ha repetit un test, etc.
Mitjançant JavaScript podem emmagatzemar cookies,
recuperar-les per llegir-les i determinar la data de caducitat per a la
seva eliminació automàtica.
Estructura d'una cookie
Nom: una identificació formada per una cadena
de caràcters.
Valor: la dada que es vol emmagatzemar.
Data d'expiració: la data en què la
cookie serà eliminada del disc dur.
Gravar una cookie
Les cookies es creen amb la funció setcookie("nom",
valor, data d'expiració) on la data d'expiració pot ser
omesa.
Veiem alguns exemples de creació de cookies:
setcookie("repeticions_fetes_del_test", 1); //indica que el test s’ha repetit una vegada
setcookie("repeticions_maximes", 4); //indica les repeticions màximes
setcookie("repeticions_fetes_del_test", repeticions);
//les repeticions fetes consten a la variable repeticions.
Observeu que en aquest últim exemple la variable
repeticions contindria el nombre de repeticions que s'han anat sumant
en alguna variable del guió javascript. Per tant, la cookie
emmagatzemaria un nombre.
Cookies que indiquen la data d'expiració
Per treballar amb dates ens cal introduir algunes idees
sobre la forma amb què javascript gestiona les dates.
Per tal de poder fer operacions matemàtiques amb dates, aquestes són representades en forma de milisegons. L'objecte new Date() ens retorna la data actual en milisegons.
Observeu el codi següent, la finalitat del qual és crear una cookie que caduqui en vint-i-quatre hores.
var caducitat= new Date();
caducitat.setTime(caducitat.getTime() + (24 * 60 * 60 * 1000));
El significat d'aquest guió és el següent:
En síntesi:
var caducitat= new Date();
caducitat.setTime(caducitat.getTime() + (24 * 60 * 60 * 1000));
Exemple d'una cookie amb data de caducitat
function actualitza()
{
var caducitat= new Date();
/* la cookie caduca als 30 dies */
caducitat.setTime(caducitat.getTime() + (30 * 24 * 60 * 60 * 1000));
setcookie("vegades_repetit_el_test", 2, caducitat);
}
Recuperar una cookie emmagatzemada al disc dur
La funció getcookie("nom de la cookie") recupera el valor d'una cookie.
Així doncs,
repeticions= getcookie("vegades_repetit_el_test");
recupera la cookie i la guarda a la variable repeticions.
Si la cookie conté un número, per
tal que es pugui utilitzar com a tal, s'ha de transformar amb la funció
Parseint().
Observeu:
repeticions= parseInt(getcookie("vegades_repetit_el_test"));
El tractament anterior ens permetrà fer operacions
matemàtiques amb repeticions.
Esborrar una cookie
Les cookies s'esborren automàticament amb
la data d'expiració determinada a la funció setcookie.
No obstant, també es poden esborrar amb la funció deletecookie("nom").
Per exemple:
deletecookie("vegades_repetit_el_test");
esborra la cookie anterior del disc dur.
Exemple final d'una cookie
Observeu que al principi del test hi ha copiat un guió
de domini públic que s'ha d'incorporar sempre que fem servir cookies.
Aquesta part del guió indica a Javascript com gestionar les cookies.
A la versió 4 dels navegadors no cal posar-lo. Tot i així
per compatibilitat millor incorporar-lo sempre. Ara no heu de parar atenció
a la part en cursiva, ja que és un codi extern que hem incorporat.
<HTML><HEAD><TITLE>Prova de cookies</TITLE>
<SCRIPT language="JavaScript">
// ---------- Funcions de Domini Públic per
controlar les cookies ------
//
// Cookie Functions - Second Helping (21-Jan-96)
// Written by: Bill Dortch, hIdaho Design <[email protected]>
// The following functions are released to the public domain.
// http://www.netscape.com/newsref/std/cookie_spec.html
//
//
// "Internal" function to return the decoded value of a cookie
//
function getCookieVal (offset) {
var endstr = document.cookie.indexOf (";", offset);
if (endstr == -1)
endstr = document.cookie.length;
return unescape(document.cookie.substring(offset, endstr));
}
// Function to return the value of the cookie specified
by "name".
function GetCookie (name) {
var arg = name + "=";
var alen = arg.length;
var clen = document.cookie.length;
var i = 0;
while (i < clen) {
var j = i + alen;
if (document.cookie.substring(i, j) == arg)
return getCookieVal (j);
i = document.cookie.indexOf(" ", i) + 1;
if (i == 0) break;
}
return null;
}
// Function to create or update a cookie.
function SetCookie (name, value) {
var argv = SetCookie.arguments;
var argc = SetCookie.arguments.length;
var expires = (argc > 2) ? argv[2] : null;
var path = (argc > 3) ? argv[3] : null;
var domain = (argc > 4) ? argv[4] : null;
var secure = (argc > 5) ? argv[5] : false;
document.cookie = name + "=" + escape (value) +
((expires == null) ? "" : ("; expires=" + expires.toGMTString())) +
((path == null) ? "" : ("; path=" + path)) +
((domain == null) ? "" : ("; domain=" + domain)) +
((secure == true) ? "; secure" : "");
}
// Function to delete a cookie. (Sets expiration date
to current date/time)
function DeleteCookie (name) {
var exp = new Date();
exp.setTime (exp.getTime() - 1); // This cookie is history
var cval = GetCookie (name);
if (cval != null)
document.cookie = name + "=" + cval + "; expires=" + exp.toGMTString();
}
// --------------FINAL DE LES FUNCIONS DE CONTROL DE
COOKIES--
// ---------- Iniciem les nostres funcions ----------
var caducitat= new Date();
/* la cookie caduca als 30 dies */
caducitat.setTime(caducitat.getTime() + (30 * 24 * 60
* 60 * 1000));
function actualitza()
{
if (GetCookie("vegades_repetit_el_test") == null) // comprova si existeix
{
SetCookie("vegades_repetit_el_test", 0, caducitat); //escriu la cookie si no existeix
}
/* actualitza la cookie i posa el seu contingut a la variable vegades_repetit*/
vegades_repetit = parseInt(GetCookie("vegades_repetit_el_test")) + 1;
/* Torna a gravar la cookie */
SetCookie("vegades_repetit_el_test", vegades_repetit, caducitat);
/* el test es pot repetir un total de 3 vegades */
repeticions_remanents = parseInt(3 - vegades_repetit);
if (repeticions_remanents > 0)
{alert("Podeu repetir el test " + repeticions_remanents + " vegades més");}
else
{alert("Ja no podeu repetir el test");}
} // final de funció
</Script>
</HEAD>
<BODY>
<H2>
<BR>
En aquesta web en construcció, en clicar el botó Avalua la cookie serà actualitzada i restarà una possibilitat de repetir el test.
<BR>
</H2>
<FORM NAME = "test">
<INPUT TYPE = "button" value = "Avalua" ONCLICK = "actualitza()">
</FORM>
</BODY>
</HTML>