JavaScript
HTML
CSS
PHP
Coming Soon
Generatori
Varie & Old

Storage (Local/Session)

Local Storage e Session Storage

Introduzione all’uso del Web Storage in JavaScript per memorizzare dati direttamente nel browser, distinguendo tra Local Storage e Session Storage.

Introduzione

Il Web Storage permette di salvare coppie chiave-valore all’interno del browser. A differenza dei cookie, i dati non vengono inviati al server e possono essere più capienti. Esistono due principali meccanismi:

  • localStorage: dati persistenti fino alla loro cancellazione manuale o da codice, i dati rimangono anche se chiudi la scheda o l’intero browser, persistono finché non vengono rimossi da codice (removeItem, clear) o dall’utente tramite le impostazioni del browser (svuotando cache o dati di navigazione).
  • sessionStorage: dati disponibili solo durante la sessione corrente, si cancellano chiudendo il browser o la scheda.

Uso del localStorage

Con localStorage possiamo salvare, leggere e cancellare dati persistenti.

Codice Esempio: utilizzo localStorage

CODE: Javascriptpreleva codice
  1. // Salvataggio
  2. localStorage.setItem("nome", "Anna");
  3.  
  4. // Lettura
  5. let valore = localStorage.getItem("nome");
  6. console.log(valore); // Anna
  7.  
  8. // Rimozione
  9. localStorage.removeItem("nome");
  10.  
  11. // Pulizia totale
  12. localStorage.clear();

Uso del sessionStorage

sessionStorage funziona allo stesso modo, ma i dati spariscono alla chiusura della scheda.

Codice Esempio: utilizzo sessionStorage

CODE: Javascriptpreleva codice
  1. // Salvataggio
  2. sessionStorage.setItem("colore", "blu");
  3.  
  4. // Lettura
  5. console.log(sessionStorage.getItem("colore")); // blu
  6.  
  7. // Rimozione
  8. sessionStorage.removeItem("colore");

Gestione di dati complessi

Poiché localStorage e sessionStorage accettano solo stringhe, per salvare oggetti o array è necessario usare JSON.stringify e JSON.parse.

Codice Esempio: salvataggio oggetto

CODE: Javascriptpreleva codice
  1. let utente = { nome: "Luca", eta: 25 };
  2.  
  3. // Conversione in stringa e salvataggio
  4. localStorage.setItem("utente", JSON.stringify(utente));
  5.  
  6. // Recupero e parsing
  7. let dati = JSON.parse(localStorage.getItem("utente"));
  8. console.log(dati.nome); // Luca

Tabella riassuntiva

Metodo Descrizione Applicazione
setItemSalva una coppia chiave-valorelocalStorage o sessionStorage
getItemRecupera un valore tramite chiaveRestituisce stringa o null
removeItemCancella un valore specificoChiave richiesta
clearSvuota tutto lo storageNon selettivo

Considerazioni

localStorage e sessionStorage sono strumenti pratici per gestire dati lato client senza ricorrere a cookie o database esterni. La scelta tra i due dipende dalla durata dei dati desiderata. Per strutture complesse è necessario l’uso di JSON.


I Cookie su questo sito:

Il nostro sito utilizza cookie e altre tecnologie in modo tale che sia noi, sia i nostri partner, possiamo ricordarci di te e capire come tu e gli altri visitatori utilizzate il nostro sito. Qui puoi trovare ulteriori informazioni sui cookie e le altre tecnologie. Chiudendo questo banner o continuando la navigazione acconsenti all'uso dei cookie. Acconsento Info Cookies