Categorie
Programmazione

Web Storage HTML5: un’alternativa ai cookies

Approfondimenti

L’utilizzo del Web Storage è davvero semplice. Chi è abituato a lavorare coi cookies noterà parecchi miglioramenti del paradigma di programmazione, soprattutto per quanto riguarda le API. Esistono però alcune limitazioni. Innanzitutto le specifiche del Web Storage sono al livello di “Candidate Recommendation”, cioè non sono ancora definitive. Questo livello delle specifiche è comunque abbastanza affidabile, perché molte tecnologie sono ormai considerate stabili quando arrivano ad essere presentate come  Candidate Recommendation. In ogni caso è bene essere prudenti quando utilizziamo il Web Storage.

A parte questa limitazione dal punto di vista tecnico dobbiamo ricordarci che il LocalStorage limita la possibilità di memorizzazione dei dati a 5MB. Si tratta comunque di un margine di lavoro abbastanza ampio, visto che di solito i dati memorizzati nel client sono molto modesti (pochi KB).

Confrontando limitazioni e vantaggi se ne può dedurre che il Web Storage è un buon candidato per sostituire i cookies. A sostegno di questa ipotesi  vediamo altre interessanti funzionalità offerta dalla tecnologia. Possiamo, ad esempio, rintracciare tutti i dati memorizzati usando una funzione come questa

for (var i = 0; i < localStorage.length; i++) {

  var pair = localStorage.key(i) + " = " + localStorage.getItem(localStorage.key(i)) ;

  window.console(pair) ;

}

oppure possiamo cancellare un singolo dato usando l’istruzione

localStorage.removeItem("my-key") ;

Se invece vogliamo cancellare tutti i dati memorizzati nel LocalStorage scriviamo

localStorage.clear() ;

Per fare qualche prova basta copiare gli snippet qui sopra e farli girare localmente nel proprio browser. Con l’occasione possiamo provare anche ad invocare i metodi del SessionStorage, utilizzando le stesse API  degli esempi appena visti. In questo modo possiamo verificare che un dato memorizzato nel  SessionStorage tramite una tab del browser non sia rintracciabile quando apriamo un’altra tab. Si tratta di un esercizio molto semplice che lasciamo al lettore: per realizzarlo basta copiare e incollare gli esempi già visti, sostituendo all’etichetta localStorage il valore sessionStorage. In particolare notiamo che, trattandosi di due meccanismi diversi e indipendenti, possiamo definire la chiave “my-key” sia nel  LocalStorage che nel  SessionStorage, senza creare alcuna ambiguità.

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *

Questo sito usa Akismet per ridurre lo spam. Scopri come i tuoi dati vengono elaborati.