online: 2; azi: 147; total: 50602 Webdesign - Javascript - 28

Cookie-uri - 1


Valorile majoritatii variabilelor dintr-un script dispar atunci cand fereastra navigatorului este inchisa. Spre deosebire de acestea, valorile variabilelor cookie se pot pastra un timp indefinit. Pentru ca valorile lor sa se poata pastra, browserul utilizatorului stocheaza variabilele cookie în unitatea de hard-disc a utilizatorului.
Astfel, cookie-urile sunt fisiere care contin diferite date despre un anumit site vizitat si valori de variabile, salvate pe calculatorul vizitatorului.
In aceasta lectie veti invata cum puteti folosi JavaScript pentru a manipula fisiere cookie.

1. Fisierele cookie

Un cookie consta in principal dintr-o pereche nume=valoare, iar caracteristici mai avansate permit stabilirea unei date de expirare si pot preciza ce pagini web vad informatia cookie.
Unul dintre avantajele folosirii fisierelor cookie este persistenta acestora. Un fisier cookie poate persista luni de zile (sau ani), simplificand vizitele ulterioare ale utilizatorului pe site, deoarece informatiile referitoare la vizite si preferintele utilizatorului sunt salvate si preluate din cookie de fiecare data cand va reveni la site.
Fisierele cookie sunt deosebit de utile cand sunt folosite cu JavaScript, deoarece JavaScript are functii pentru citirea, adaugarea si editarea fisierelor cookie.
Fisierele cookie au si unele dezavantaje, fiind stocate pe calculatorul utilizatorului acestea poat fi sterse din gresela (sau intentionat).
Browserul impune restrictii privind dimensiunea si numarul de fisiere cookie care pot fi stocate, iar fisierele cookie mai noi le pot suprascrie pe cele vechi.

  • - Numarul total de cookie-uri pentru un server sau domeniu este de 200
    - Numarul total de fisiere cookie pentru un browser este de 300
    - Marimea maxima a unui fisier cookie este 4 kb.
Daca aceste limite sunt depasite, browserul va sterge cele mai vechi cookie-uri si nefolosite.
Cand un utilizator trece de la un browser la altul, fisierele cookie salvate de un browser nu sunt recunoscute de celalalt
Daca mai multi utilizatori folosesc acelasi calculator si acelasi browser ei pot folosi fisiere cookie care apartin altcuiva.
Cele mai multe browsere stocheaza informatiile cookie in fisiere text necriptate, de aceea informatiile private precum parole, numere personale nu trebuie stocate direct intr-un cookie.
Utilizatorul poate configura browserul astfel incat sa interzica anexarea de cookie, in acest caz aplicatia care foloseste cookie ar putea sa nu functioneze.

2. Stocarea si regasirea valorilor unui cookie

Numele si valorile dintr-un cookie sunt stocate si stabilite utilizand proprietatea cookie a obiectului Document.
Pentru a stoca sirul cookie intr-o variabila se foloseste o comanda precum aceasta:

  • var myCookie = document.cookie
Pentru a afisa intr-o pagina web sirul astfel stocat , puteti folosi comanda:
  • document.write(document.cookie)
JavaScript stocheaza fisierele cookie in formatul urmator:
  • nume1=valoare1; nume2=valoare2; nume3=valoare3
Unde "nume1", "nume2" si "nume3" reprezinta numele fiecarui cookie, iar "valoare1", "valoare2" si "valoare3" reprezinta valorile care vor fi adaugate si stocate in fiecare cookie.
Perechile nume=valoare sunt separate prin caracterul punct si virgula (;) si un spatiu, iar dupa ultima pereche nu se mai pune caracterul punct si virgula.
Pentru extragerea si utilizarea valorilor din fisierele cookie, trebuie sa prelucrati sirul obtinut prin comanda "document.cookie".
Pentru a simplifica regasirea unei valori dintr-un fisier cookie, puteti folosi o functie ca cea din urmatorul script:
<script type="text/javascript">
function GetCookie (name) {
    var result = null;
    var myCookie = " " + document.cookie + ";";         // toate sirurile de cookie incep cu spatiu si se incheie cu ;
    var searchName = " " + name + "=";         // se cauta tot ce e intre name si = urmator
    var startOfCookie = myCookie.indexOf(searchName);
    var endOfCookie;
    if (startOfCookie != -1) {         // daca gaseste ceva intre ele
        startOfCookie += searchName.length;         // omite nume cookie anterior
        endOfCookie = myCookie.indexOf(";", startOfCookie);
        result = unescape(myCookie.substring(startOfCookie, endOfCookie));
    }
    return result;
}

var valoare_c = GetCookie('nume_cookie');
document.write(valoare_c);         // Afiseaza valoarea cookie-ului cautat, sau cuvantul null
</script>
- Functia "GetCookie(name)" prelucreaza sirul obtinut de comanda "document.cookie" si verifica daca exista cookie-ul cu numele transmis ca argument functiei. Daca cookie-ul cu numele respectiv exista, atribuie variabilei "result" valoarea asociata numelui si functia va returna aceasta valoare. Daca numele nu exista, valoarea variabilei "result", si returnata de functie, ramane "null".
- Variabila "valoare_c" apeleaza functia "GetCookie()", unde 'nume_cookie' dintre paranteze, este numele cookie-ului a carui valoare doriti sa o obtineti.
Prin comanda "document.write(valoare_c)" scriptul va afisa valoarea acestei variabile, care este cea returnata de functie.

3. Stabilirea valorilor unui cookie

Combinatia nume=valoare este informatia minima de care aveti nevoie pentru a defini un cookie, dar un cookie bine definit inseamna mai mult de atat.
Iata o lista de parametrii ce pot fi utilizati pentru a specifica un cookie:

  • nume=valoare
    expires=date
    path=path
    domain=nume_domeniu
    secure
           a. Nume si valoare
  • Nume si valoare poate fi orice cuvinte doriti
  • Exemplu:
    • culoare favorita=blue
      id=num:1
  • Cea mai simpla functie pentru stabilirea unui cookie poate arata astfel:
    function SetareCookie(name, value) {
        document.cookie = name + "+" + escape(value);
    }
  • Pentru siguranta, valoarea este codificata folosind functia "escape()". Daca in sir ar exista un caracter ";" ar puteaa fi o problema, dar aceasta functie elimina aceasta problema.
    In general operatorul = este de atribuire, dar in cazul cookie-urilor fiecare nou "name" pe care il atribuiti este adaugat la lista de cookie activa, iar daca adaugati acelasi nume se va rescrie peste cel vechi.
           b. Data de expirare
  • Parametrul "expires=data" reprezinta data si timpul (in formatul Wdy, DD-Mon-YYYY HH:MM:SS GMT) cand cookie-ul va expira si va fi sters de pe hard-disc.
    Perioada de expirare trebuie transformata in milisecunde.
    Daca nu este specificat nici un timp de expirare, cookie-ul va dispare la inchiderea navigatorului.
  • Iata un exemplu in care data de expirare este dupa o saptamana:
    var name = "culoare"
    var value = "blue"
    var oneWeek = 7*24*60*60*1000         // Data de expirare se stabileste in mulisecunde
    var expDate = new Date()
    expDate.setTime(expDate.getTime()+oneWeek);
    document.cookie = name + "=" + escape(value) + "; expires=" + expDate.toGMTString()
  • Observati ca data de expirare (dateExp) este prelucrata pentru a se incheia cu sirul GMT.
           c. Path
  • In mod implicit fisierele cookie sunt disponibile si pentru alte pagini web din acelasi director al paginii la care au fost create.
    Parametrul path permite unui cookie sa fie folosit si de pagini din alte directoare ale aceluiasi domeniu.
    Daca valoarea parametrului "path" este un subsir al adresei URL a unei pagini, fisierele cookie create cu acel parametru "path" sunt disponibile pentru respectiva pagina.
    De exemplu, puteti crea un cookie folosind urmatoarea comanda:
    • document.cookie = "nume=valoare; path=/nume_director";
  • Aceasta face ca fisierul cookie cu numele "nume" sa fie disponibil pentru fiecare pagina din directorul "nume_director" cat si penrtru subdirectoarele acestuia.
  • Daca ati avea urmatoarea comanda:
    document.cookie = "culoare=blue; path=/javascript/test";
  • Fisierul cookie "culoare" ar fi disponibil pentru toate fisierele din directorul "javascript/test" si subdirectoare ale acestuia, dar nu va fi disponibil pt. fisierele din directorul "/javascript".
    Calea generala pentru ca fisierul cookie sa poata fi folosit de toate paginile unui domeniu, din toate directoarele, este calea radacina "/" (path=/).
           d. Domain
  • Asa cum parametrul "path" face un cookie disponibil si in alte directoare, parametrul domain il face disponibil pentru alte servere Web sau subdomenii ale aceluias site.
    Folosirea parametrului "domain" impune folosirea a cel putin doua caractere punct (.) daca domeniul dvs se incheie cu .com, .net ... (de ex. .discant.ro) Sirul parametrului "domain" trebuie sa fie identic cu sfarsitul numelui de domeniu al serverului dvs.
    Atunci cind se cauta un cookie in lista de cookie-uri se efectueaza si o comparatie intre valoarea acestui atribut si adresa domeniului din care s-a receptionat antetul HTTP. Comparatia se realizeaza pornind de la sufixul valorilor comparate, in sensul ca daca avem "domain=discant.ro atunci aceasta valoare se va potrivi cu un nume de gazda precum "info.discant.ro".
    Dupa ce s-a efectuat aceasta comparatie, in cazul in care cookie-ul este validat se va verifica si valoarea atributului "path".
           e. Secure
  • Daca un cookie este marcat ca secure, prin intermediul acestui atribut, va fi transmis numai daca tranzactia HTTP este una sigura (folosindu-se protocolul HTTPS).
    In felul acesta un cookie este transmis doar daca intruneste toate conditiile de validitate (se potrivesc domeniul, calea de directoare, timpul de expirare si securitatea canalului de comunicatie).
    Daca parametrul "secure" nu este adaugat in comanda de creare a fisierului cookie, acesta va trimis intr-o forma necriptata prin retea.
In urmaorul exemplu este prezentata o functie care defineste fisierele cookie cu toti parametri:
function SetCookie (name, value, expires, path, domain, secure) {
    var expString = ((expires == null) ? "" : ("; expires=" + expires.toGMTString()));
    var pathString = ((path == null) ? "" : ("; path=" + path));
    var domainString = ((domain == null) ? "" : ("; domain=" + domain));
    var secureString = ((secure == true) ? "; secure" : "");
    document.cookie = name + "=" + escape (value) + expString + pathString + domainString +secureString;
}
Observati folosirea operatorului conditional ?
Pentru a folosi acesta functie, o apelati cu orice parametrii doriti sa stabiliti si utilizati cuvantul "null" in locul parametrilor care nu conteaza.