Tornar a la pàgina anterior


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>