La proprietà document.cookie in Javascript
La proprietà cookie dell’oggetto documento mi permette di creare e recuperare i dati dei cookie nel browser tramite ill codice Javascript.
Cos'è un cookie? Un cookie è una piccola quantità di dati in una stringa, utilizzata dai siti web per identificare o memorizzare informazioni sul browser dell' utente. Ad esempio una sessione o qualsiasi altra cosa utile da ricordare tra le pagine web.
Leggere i cookie
Per leggere tutti i cookie salvati sul browser dell'utente dal sito web, mi basta assegnare il contenuto della proprietà in una variabile.
var myVar = document.cookie;
In questo modo, la variabile myVar conterrà una stringa con tutti i cookie del sito, separati da punto e virgola.
Scrivere un cookie
Per creare un nuovo cookie, assegno una stringa di dati alla proprietà document.cookie seguendo questa sintassi:
document.cookie = "chiave=valore; expires=data; path=percorso; domain=dominio; secure";
Dove i parametri hanno questo significato
- chiave=valore: La coppia chiave/valore del tuo cookie. Sia la chiave che il valore sono personalizzabili dal sito web.
- expires=data: La data di scadenza del cookie. Se non impostata, il cookie dura fino alla chiusura del browser.
- path=percorso: Il percorso nel dominio in cui il cookie è accessibile.
- domain=dominio: Il dominio in cui il cookie è accessibile.
- secure: L'attributo secure assicura che i cookie siano inviati solo su connessioni sicure (HTTPS).
Nota. L'attributo HttpOnly consente di proteggere i cookie dalle vulnerabilità XSS, in quanto non saranno accessibili tramite JavaScript.
Un esempio pratico
Questo comando scrive sul browser dell'utente un cookie che memorizza la preferenza della lingua come italiano.
In questo esempio la chiave si chiama "lingua" mentre il valore è "it". Il cookie scade il 31 dicembre del 2023.
document.cookie = "lingua=it; expires=Fri, 31 Dec 2023 23:59:59 GMT; path=/";
Per modificare un cookie, mi basta impostarlo di nuovo con lo stesso nome della chiave e path, ma con un valore diverso.
Ad esempio, assegno il valore "en" alla chiave "lingua".
document.cookie = "lingua=en; expires=Fri, 31 Dec 2023 23:59:59 GMT; path=/";
Per eliminare il cookie, invece, devo impostarlo con una data di scadenza nel passato
document.cookie = "lingua=; expires=Thu, 01 Jan 1970 00:00:00 GMT; path=/";
Alcune considerazioni sulla sicurezza.
E così via.
