Il session storage è una nuova caratteristica introdotta con le API di HTML5. Tramite l'oggetto sessionStorage
possiamo memorizzare sul computer dell'utente dei dati che verranno automaticamente rimossi dal browser al termine della sessione di navigazione. Vediamo insieme questa caratteristica.
Salvare i dati
I dati vengono salvati come stringhe. Ciascun dato è una coppia formata da una chiave e da un valore:
var Storage = {
set: function (item, value) {
sessionStorage.setItem(item, value);
},
// continua
};
Esempio:
Storage.set('test', 'value');
Abbiamo appena creato la voce test
il cui valore è value
.
Reperire i dati
I dati vengono reperiti conoscendo il nome della voce:
var Storage = {
set: function (item, value) {
sessionStorage.setItem(item, value);
},
get: function (item) {
var value = sessionStorage.getItem(item);
return value;
},
// continua
};
Esempio:
var test = Storage.get('test');
console.log('test'); // 'value'
Conteggio delle voci, rimozione delle voci ed eliminazione totale dei dati
Possiamo reperire il numero di voci presenti, rimuverle e cancellare i dati in questo modo:
var Storage = {
set: function (item, value) {
sessionStorage.setItem(item, value);
},
get: function (item) {
var value = sessionStorage.getItem(item);
return value;
},
count: function () {
var len = sessionStorage.length;
return len;
},
remove: function (item) {
sessionStorage.removeItem(item);
},
empty: function () {
sessionStorage.clear();
},
// continua
};
Salvare oggetti
Per impostazione predefinita il session storage accetta valori solo sotto forma di stringhe. Qualora volessimo salvare oggetti è necessario far ricorso ai metodi JSON.stringify()
e JSON.parse()
:
var Storage = {
set: function (item, value) {
sessionStorage.setItem(item, value);
},
get: function (item) {
var value = sessionStorage.getItem(item);
return value;
},
count: function () {
var len = sessionStorage.length;
return len;
},
remove: function (item) {
sessionStorage.removeItem(item);
},
empty: function () {
sessionStorage.clear();
},
saveObject: function (item, obj) {
if (typeof obj === 'object') {
this.set(item, JSON.stringify(obj));
} else {
this.set(item, 'Could not convert to JSON string');
}
},
getObject: function (item) {
var json = this.get(item);
var obj = JSON.parse(json);
return obj;
}
};