Quando un sito web presenta problemi di accesso, errori di sessione o comportamenti anomali, una delle operazioni più semplici da provare è la cancellazione dei cookie.
Google Chrome permette di cancellare i cookie dalle normali impostazioni del browser, ma esiste anche un metodo molto più preciso: utilizzare i Chrome DevTools, gli strumenti per sviluppatori integrati direttamente in Chrome.
Con questa procedura possiamo vedere quali cookie sono associati al sito che stiamo visitando ed eliminarli senza dover necessariamente cancellare quelli di tutti gli altri siti.
Cosa sono i cookie?
I cookie sono piccoli dati che un sito web può memorizzare attraverso il browser.
Possono essere utilizzati per diversi scopi, ad esempio:
- mantenere attiva una sessione dopo il login;
- ricordare alcune preferenze dell’utente;
- gestire determinate funzionalità del sito;
- memorizzare informazioni tecniche;
- supportare sistemi statistici o, quando previsto, pubblicitari.
In alcuni casi un cookie non più valido o relativo a una vecchia sessione può contribuire al malfunzionamento di un sito.
Possiamo quindi trovarci davanti a situazioni come login che non funziona correttamente, continui reindirizzamenti, logout apparentemente inspiegabili oppure impostazioni che sembrano non aggiornarsi.
Eliminare i cookie del sito consente di verificare rapidamente se il problema è collegato ai dati memorizzati localmente dal browser.
Come aprire Chrome DevTools
Per prima cosa apriamo con Google Chrome il sito sul quale vogliamo intervenire.
Possiamo quindi aprire gli strumenti per sviluppatori premendo:
F12
Su Windows e Linux possiamo utilizzare anche:
Ctrl + Shift + I
Su macOS:
⌘ + Option + I
In alternativa è possibile accedere ai DevTools attraverso il menu di Chrome e gli strumenti dedicati agli sviluppatori.
Una volta aperti, gli strumenti possono essere visualizzati lateralmente oppure nella parte inferiore della finestra del browser.
Aprire la sezione Application
All’interno dei Chrome DevTools selezioniamo la scheda:
Application
Se la voce non è immediatamente visibile nella barra superiore, potrebbe essere necessario aprire il menu contenente le altre schede disponibili.
La sezione Application permette di analizzare numerosi dati utilizzati dalle applicazioni web.
Tra questi troviamo:
- Local Storage;
- Session Storage;
- IndexedDB;
- Cookies;
- Cache Storage;
- Service Worker;
- altri sistemi di memorizzazione utilizzati dal browser.
Per la procedura che ci interessa dobbiamo concentrarci sulla voce Cookies.
Come visualizzare i cookie di un sito
Nel menu laterale dei DevTools cerchiamo la sezione:
Storage → Cookies
Facendo clic sulla freccia accanto alla voce Cookies vengono mostrati i domini per i quali sono presenti cookie nel contesto della pagina aperta.
Selezioniamo quindi il dominio del sito che vogliamo controllare.
Chrome mostrerà una tabella contenente i cookie disponibili.
Per ogni cookie possiamo trovare diverse informazioni tecniche, tra cui:
- Name;
- Value;
- Domain;
- Path;
- Expires / Max-Age;
- Size;
- HttpOnly;
- Secure;
- SameSite.
Queste informazioni sono particolarmente utili per gli sviluppatori perché permettono di verificare come il sito sta gestendo i propri cookie.
Attenzione ai valori mostrati nei cookie
È importante prestare attenzione alla colonna Value.
Alcuni cookie possono contenere identificatori di sessione, token o altre informazioni che non dovrebbero essere condivise pubblicamente.
Se dobbiamo inviare uno screenshot dei DevTools a un tecnico, pubblicarlo su un forum oppure inserirlo in un articolo, è quindi buona norma oscurare preventivamente i valori potenzialmente sensibili.
Come eliminare un singolo cookie
Uno dei principali vantaggi dei Chrome DevTools è la possibilità di intervenire in maniera selettiva.
Se sappiamo quale cookie vogliamo eliminare, possiamo selezionarlo nella tabella e utilizzare il relativo comando di cancellazione.
In questo modo possiamo rimuovere soltanto quel cookie, lasciando invariati gli altri dati.
È una possibilità particolarmente interessante durante le attività di sviluppo e debugging.
Ad esempio, uno sviluppatore può eliminare il cookie utilizzato per una determinata funzionalità e verificare immediatamente come si comporta l’applicazione quando quel valore non è più presente.
Come eliminare tutti i cookie del sito
Se non sappiamo quale cookie potrebbe essere responsabile del problema, possiamo invece eliminare tutti quelli associati al dominio interessato.
Dopo aver effettuato la cancellazione è consigliabile ricaricare completamente la pagina.
Il sito potrà così creare nuovamente i cookie necessari al proprio funzionamento.
Se abbiamo eliminato cookie utilizzati per l’autenticazione, è del tutto normale che venga richiesto di effettuare nuovamente il login.
Cookie, cache e Local Storage non sono la stessa cosa
Un errore piuttosto comune consiste nel considerare cookie e cache come se fossero la stessa cosa.
In realtà un’applicazione web moderna può utilizzare diversi sistemi per memorizzare informazioni nel browser.
Tra questi troviamo:
Cookies
Piccoli dati che possono essere utilizzati, tra le altre cose, per sessioni, preferenze e identificatori.
Local Storage
Permette a un sito di conservare dati localmente nel browser, normalmente senza una scadenza automatica equivalente a quella dei cookie.
Session Storage
Simile al Local Storage, ma collegato alla sessione della scheda del browser.
IndexedDB
Un sistema di database locale che le applicazioni web possono utilizzare per memorizzare quantità di dati più strutturate.
Cache Storage
Utilizzato soprattutto dalle applicazioni web e dai Service Worker per conservare localmente determinate risorse.
Questo significa che eliminare i cookie potrebbe non essere sufficiente se il problema dipende da dati conservati attraverso uno di questi altri sistemi.
Cancellare i dati del sito tramite DevTools
La scheda Application dei Chrome DevTools mette a disposizione anche strumenti che permettono di intervenire in maniera più ampia sui dati memorizzati dal sito.
Questa soluzione può essere utile quando vogliamo effettuare una sorta di reset dei dati locali dell’applicazione.
Bisogna però utilizzarla con maggiore attenzione.
La cancellazione dei dati del sito potrebbe infatti comportare:
- logout dall’account;
- perdita delle preferenze memorizzate localmente;
- eliminazione di dati offline;
- necessità di riconfigurare alcune impostazioni del sito.
Per un semplice problema di sessione è quindi generalmente preferibile iniziare dalla cancellazione dei cookie e passare agli altri dati soltanto se necessario.
Quando è utile cancellare i cookie con Chrome DevTools?
Questa procedura può risultare particolarmente utile quando:
- un sito non permette più di effettuare correttamente il login;
- dopo il login veniamo continuamente reindirizzati;
- il sito continua a utilizzare una vecchia sessione;
- alcune preferenze non sembrano aggiornarsi;
- stiamo sviluppando o testando un’applicazione web;
- vogliamo eliminare i cookie di un sito senza intervenire sugli altri;
- vogliamo verificare il comportamento di un’applicazione senza un determinato cookie.
Per chi sviluppa siti e applicazioni web, la sezione Application rappresenta inoltre un ottimo strumento per controllare direttamente quali dati vengono memorizzati dal browser.
Cancellare i cookie risolve sempre il problema?
No.
La cancellazione dei cookie è un test diagnostico, non una soluzione universale.
Se il problema dipende dal server, dal codice JavaScript dell’applicazione, dalla configurazione del browser, da un’estensione, dalla rete o da altri componenti, cancellare i cookie potrebbe non produrre alcun risultato.
Se però il problema è collegato a una sessione non valida o a informazioni memorizzate localmente, questa semplice operazione può permettere di ripristinare rapidamente il corretto funzionamento del sito.
Conclusioni
I Chrome DevTools non sono utili soltanto agli sviluppatori.
La scheda Application permette infatti di vedere con precisione quali dati vengono conservati localmente durante la navigazione e può diventare un ottimo strumento anche per diagnosticare problemi apparentemente difficili da individuare.
Quando un sito presenta anomalie legate all’accesso o alla sessione, possiamo quindi aprire:
Chrome DevTools → Application → Storage → Cookies
e controllare i cookie associati al dominio.
Il vantaggio rispetto alla cancellazione generale dei dati di navigazione è soprattutto uno: possiamo intervenire sul sito interessato senza cancellare inutilmente i cookie di tutti gli altri siti utilizzati nel browser.
❤️ Ti è piaciuto questo articolo?
Condividilo con un amico che potrebbe trovare utile questa procedura e continua a seguire Albilab.it per guide, tutorial, trucchi e novità sul mondo della tecnologia! 🚀
Commenti recenti