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: Javascript

1. // Salvataggio

2. localStorage.setItem("nome", "Anna");

4. // Lettura

5. let valore = localStorage.getItem("nome");

6. console.log(valore); // Anna

8. // Rimozione

9. localStorage.removeItem("nome");

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: Javascript

1. // Salvataggio

2. sessionStorage.setItem("colore", "blu");

4. // Lettura

5. console.log(sessionStorage.getItem("colore")); // blu

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: Javascript

1. let utente = { nome: "Luca", eta: 25 };

3. // Conversione in stringa e salvataggio

4. localStorage.setItem("utente", JSON.stringify(utente));

6. // Recupero e parsing

7. let dati = JSON.parse(localStorage.getItem("utente"));

8. console.log(dati.nome); // Luca

Tabella riassuntiva

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.