Disabilitazione della cache di Chrome per lo sviluppo di siti Web

Sto modificando l’aspetto di un sito (modifiche CSS) ma non riesco a vedere il risultato su Chrome a causa della fastidiosa cache persistente. Ho provato Shift + refresh ma non funziona.

Come posso disabilitare temporaneamente la cache o aggiornare la pagina in qualche modo che potrei vedere le modifiche?

    Chrome DevTools può disabilitare la cache.

    1. F12 o Fare clic con il pulsante destro del mouse e Inspect Element per aprire DevTools.
    2. Ora fai clic su Network nella barra degli strumenti per aprire il pannello di rete.
    3. Infine, seleziona la casella Disable cache in alto.

    screenshot del pannello degli strumenti di sviluppo

    Tieni presente che, come ha scritto un tweet da @ChromiumDev, questa impostazione è triggers solo mentre devtools è aperto .

    Si noti che ciò comporterà la ricarica di tutte le risorse. Se si desidera distriggersre la cache solo per alcune risorse, è ansible modificare l’intestazione HTTP che il server invia insieme ai propri file. Puoi leggere di più su questo qui .

    inserisci la descrizione dell'immagine qui

    Cancellare la cache è troppo fastidioso quando è necessario svuotare la cache 30 volte all’ora .. quindi ho installato un’estensione di Chrome chiamata Classic Cache Killer che cancella la cache in ogni caricamento della pagina.

    Chrome Store Link (gratuito) (ora senza malware!)

    Ora il mio finto json, javascript, css, html e i dati si aggiornano ogni volta su ogni caricamento della pagina .

    Non devo mai preoccuparmi se ho bisogno di svuotare la cache.

    Ci sono circa 20 pulitori di cache per Chrome che ho trovato, ma questo sembrava leggero e zero sforzo. In un aggiornamento, Cache Killer può ora rimanere “sempre attivo”.

    Nota: non conosco l’autore del plugin in alcun modo. L’ho trovato utile.

    Immagine del menu di ricarica

    1. Apri la console degli sviluppatori di Chrome premendo F12 e quindi (con la console aperta):

    2. Fai clic con il pulsante destro del mouse (o tieni premuto il tasto sinistro del mouse) sul pulsante di ricarica nella parte superiore del browser e seleziona “Svuota cache e ricarica dura”.

    Questo andrà oltre “Hard Reload” per svuotare completamente la cache, assicurando che qualsiasi cosa scaricata tramite javascript o ecc. Eviterà anche l’uso della cache. Non devi fare confusione con le impostazioni o altro, è una soluzione rapida da 1 colpo.

    Ci sono altre due opzioni per disabilitare la memorizzazione nella cache delle pagine in Chrome per bene :

    1. Distriggers la cache di Chrome nel registro

    Apri registro (Start -> Comando -> Regedit)

    Cerca: HKEY_CLASSES_ROOT\ChromeHTML\shell\open\command

    Cambia la parte dopo … chrom.exe “con questo valore: –disable-application-cache –media-cache-size=1 –disk-cache-size=1 — "%1"

    Esempio: "C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" -disable-application-cache –media-cache-size=1 –disk-cache-size=1 — "%1"

    IMPORTANTE:

    • c’è uno spazio e un trattino dopo … chrome.exe ”

    • lascia il percorso a chrome.exe così com’è

    • Se copi la linea, assicurati di controllare, se le virgolette sono virgolette effettive.

    2. Distriggers la cache di Chrome modificando le proprietà di collegamento

    Fai clic con il tasto destro sull’icona di Chrome e seleziona “Proprietà” nel menu di scelta rapida. Aggiungi il seguente valore al percorso: –disk-cache-size=1

    Esempio: "C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" –disk-cache-size=1

    IMPORTANTE:

    • c’è uno spazio e un trattino dopo … chrome.exe ”

    • lascia il percorso a chrome.exe così com’è

    Se non desideri modificare le impostazioni di Chrome, puoi utilizzare la modalità di navigazione in incognito per gli stessi risultati.

    Oltre all’opzione Disabilita cache (che si ottiene tramite un pulsante nell’angolo in basso a destra della finestra degli strumenti di sviluppo – Strumenti | Strumenti per sviluppatori, o Ctrl + Maiusc + I ), nel pannello di rete degli strumenti di sviluppo è ansible ora fai clic destro e scegli “Cancella cache” dal menu popup.

    1. F12 per aprire Chrome DevTools
    2. F1 per aprire Impostazioni DevTools
    3. Selezionare Disabilita cache (mentre DevTools è aperto) come mostrato di seguito:

    Questo è attualmente nella scheda Preferenze che è l’impostazione predefinita. Potrebbe essere necessario scorrere verso il basso. Questa casella è stata spostata almeno un paio di volte da quando è stata posta questa domanda. L’ultima volta che ho controllato, era nella colonna centrale in fondo. Se lo hai aperto su uno schermo più sottile e ci sono 2 colonne in Preferenze, potrebbe essere vicino all’angolo in alto a destra. Sentiti libero di aggiornare questo post se cambia o commenta e aggiornerò il post.

    inserisci la descrizione dell'immagine qui

    Nel Canary Channel (e forse il dev e il canale stabile seguiranno insieme) questa è la seconda opzione in generale sul lato sinistro sotto la sezione “Generale”.

    Disabilita cache nel canale Canary di Chrome

    In aggiunta a ciò, c’è sempre la possibilità di passare alla modalità di navigazione in incognito tramite Ctrl + Shift + N. Anche se sfortunatamente termina anche la sessione.

    Invece di colpire “F5”, basta premere:

    “Ctrl + F5”

    Per essere chiari, la casella di controllo disabilita cache in Chrome (v17 qui, ma poiché v15 credo) non è nell’interfaccia utente delle impostazioni principali. È nell’interfaccia utente delle impostazioni degli strumenti di sviluppo.

    1. Dal menu icona chiave inglese della finestra del browser (menu Preferenze) scegliere Strumenti → Strumenti per sviluppatori

    2. Nell’interfaccia utente degli strumenti di sviluppo visualizzata, fai clic sull’icona a forma di ingranaggio in basso a destra.

    3. Seleziona la casella di controllo “Disabilita cache” nella sezione Rete.

    Usare Ctrl + Shift + R per aggiornare era bello ma non ha ottenuto tutto ciò di cui avevo bisogno. ancora alcune cose non si aggiornerebbero, come i dati memorizzati in js e css. trovato una soluzione: una barra degli strumenti di google per gli sviluppatori web di Chrome . Dopo aver installato la barra degli strumenti seleziona le opzioni e “ripristina pagina”.

    Distriggers cache in chrome funziona solo quando hai gli strumenti di sviluppo aperti

    Fino a quando il problema non viene risolto, puoi utilizzare il plug-in Clear Cache per Chrome e puoi anche impostare una scorciatoia da tastiera.

    Dopo averlo installato, fai clic con il pulsante destro del mouse e vai alle opzioni:

    http://j.mp/15ZdA6f

    Verifica Automatically reload active tab after clearing data :

    http://j.mp/15ZdGLh

    Seleziona Everything per Periodo:

    http://j.mp/15ZdPy7

    E poi puoi andare su Menu => Strumenti => Estensioni:

    http://j.mp/15ZehfX

    Fai clic sulle scorciatoie da tastiera nella parte inferiore:

    http://j.mp/15Zepft

    E imposta la scorciatoia da tastiera, ad esempio Ctrl + Maiusc + R :

    http://j.mp/15Zev6M

    In realtà se non ti dispiace usare la larghezza di banda è più sicuro per molteplici ragioni disabilitare la memorizzazione nella cache e consigliato da molti siti di sicurezza.

    Chromium non dovrebbe essere abbastanza arrogante per prendere decisioni e applicare le impostazioni agli utenti.

    È ansible disabilitare la cache su UNIX con –disk-cache-dir = / dev / null.

    Poiché si tratta di crash inaspettati, potrebbe succedere, ma se lo fanno, ciò indicherà chiaramente un bug più grave che dovrebbe essere risolto in ogni caso.

    Questo potrebbe aiutare qualcuno.

    Ho truccato il mio Nginx per il pazzo del caching. Pertanto, la distriggerszione della cache negli strumenti di rete e la cache di compensazione esplicita non funzionano.

    Una soluzione molto semplice ma noiosa è, ho appena aperto una nuova scheda di navigazione in incognito. Sorprendentemente funziona, sempre!

    Un duro aggiornamento in modalità in incognito fa il trucco ogni volta che desidero ricaricare nella stessa modalità.

    Che ne dici di un bookmarklet che cambia il nome della pagina per impedire che la pagina venga memorizzata nella cache. In Chrome devi creare un nuovo segnalibro e quindi incollare il codice nell’URL. Fai clic sul segnalibro e la pagina verrà ricaricata con il timestamp per sventare la cache.

     javascript:(function(){var idx = location.href.indexOf('?');var d = new Date();var str = location.href.substr(0,idx) + '?version=' + d.getTime();location.href=str; void 0;})(); 

    Sono appena stato scoperto ma non necessariamente a causa di Chrome.

    Sto usando jQuery per fare richieste AJAX. Ho avuto l’attributo di cache impostato su true nella richiesta:

      $.ajax({ type: 'GET', cache: true, .... 

    Impostando questo su false è stato risolto il problema ma questo non è l’ideale.

    Non ho idea di dove vengono salvati questi dati, ma so che Chrome non ha mai colpito il server per una richiesta.

    È disponibile un’estensione di Chrome nel negozio Web di Chrome denominato Clear Cache .

    Lo uso tutti i giorni ed è uno strumento molto utile che penso. Puoi usarlo come pulsante di ricarica e puoi svuotare la cache e se ti piacciono anche i cookie, lo spazio di archiviazione locale, i dati dei moduli ecc. Puoi anche definire su quale dominio ciò avvenga. Quindi puoi cancellare tutta questa merda con solo il pulsante di ricarica che devi comunque premere – sui domini scelti.

    Molto molto carino!

    Puoi anche definire una scorciatoia da tastiera per questo nelle opzioni!

    Un altro modo è quello di avviare la finestra Chrome in modalità in incognito. Anche qui la cache dovrebbe essere completamente disabilitata.

    Ora c’è un modo migliore e più veloce (versione di Chrome 59.xx):

    Fai clic destro sull’icona di ricarica (a sinistra del campo url) e ottieni un menu a discesa, seleziona la terza opzione: ‘Svuota cache e ripristino rapido’.

    Questa opzione è disponibile solo quando gli strumenti di sviluppo sono aperti. (Notare la differenza con l’opzione 2: “Ristampa dura” -cmd-shift-R). Nessun svuotamento della cache qui!

    Un’ulteriore opzione per disabilitare la cache è fornita dalla mia terza estensione per le dimensioni della pagina di Chrome che disabilita la cache esattamente come fa Devtools.

    Inoltre, l’estensione riporta rapidamente le dimensioni della pagina, l’utilizzo della cache, le richieste di rete e il tempo di caricamento di una pagina Web in modo conveniente. Più il suo open source a Github .

    Screenshot - Ispettore dimensioni pagina

    Non sei sicuro di cosa stai usando, ma se stai usando ASP.Net puoi fare quanto segue che funziona come un incantesimo:

      

    Fondamentalmente aggiungerà automaticamente la data e l’ora alla fine del file ogni volta che viene eseguito, il che significa che poiché il nome del file è tecnicamente diverso, non dovrai mai preoccuparti di tornare alla cache.

    Come posso disabilitare temporaneamente la cache o aggiornare la pagina in qualche modo che potrei vedere le modifiche?

    Non è chiaro a quale “cache” ti riferisci. Esistono diversi metodi con cui un browser può memorizzare il contenuto in modo persistente. Essendo uno di questi i Web Storage , Cache-Control è un altro.

    Alcuni browser hanno anche una Cache , utilizzata in collaborazione con i service worker, per creare Progressive Web Apps (PWA) che forniscono supporto offline.

    Per cancellare la cache per un PWA

     self.caches.keys().then(keys => { keys.forEach(key => console.log(key)) }) 

    per elencare i nomi delle chiavi della cache, quindi eseguire:

     self.caches.delete('my-site-cache') 

    eliminare una chiave di cache per nome (ad es. my-site-cache ). Quindi aggiorna la pagina.

    Se dopo l’aggiornamento vengono visualizzati errori relativi ai dipendenti nella console, potrebbe essere necessario annullare la registrazione dei lavoratori registrati:

     navigator.serviceWorker.getRegistrations() .then(registrations => { registrations.forEach(registration => { registration.unregister() }) }) 

    Se il tuo sito utilizza PHP, inserisci il seguente piccolo snippet PHP all’inizio della pagina html:

      //dev versioning - stop caching $rand = rand(1, 99999999); 

    Ora ovunque si caricano risorse come i file CSS o JS in uno script o un elemento di collegamento si aggiunge il valore casuale generato all’URL della richiesta dopo l’aggiunta di “?” all’URI tramite PHP:

      echo $rand; 

    Questo è tutto! Non ci sarà più browser che memorizza nella cache il tuo sito, indipendentemente dal tipo.

    Ovviamente rimuovi il tuo codice prima di pubblicarlo o semplicemente imposta $ rand su una stringa vuota per consentire nuovamente il caching.

    Ho usato le altre opzioni sopra descritte, ma trovo che la cosa migliore sia aggiungere il seguente parametro all’avvio di chrome.exe.

    “C: \ Programmi (x86) \ Google \ Chrome \ Application \ chrome.exe” –disk-cache-size = 1 -media-cache = 1

    Trovo che non disabilitare la cache dei media è una buona idea, ma è qui per completezza.

    In realtà voglio un’opzione per disabilitare completamente la cache, per usare la memoria per IO al posto del mio disco (il che renderebbe anche il tempo di caricamento 10 volte più veloce!) Ma non penso che Chrome o qualsiasi browser abbia ancora quell’opzione .

    Dalla versione 50 (se ricordo male), l’opzione “Disabilita cache” è stata rimossa dalle Impostazioni Devtool. Vai alla scheda “Rete” e c’è l’opzione “Disabilita cache”.

    L’assassino della cache di Chrome è di gran lunga l’opzione migliore. Poiché l’URL del negozio per installare cache killer è inattivo, puoi scaricare il file CRX qui:

    https://www.crx4chrome.com/extensions/jpfbieopdmepaolggioebjmedmclkbap/

    una volta scaricato il file di estensione, apri Chrome -> altri strumenti -> estensioni, quindi trascina il file CRX da Esplora file o dal desktop (in base alla posizione in cui hai scaricato il file) nella finestra di Chrome per installare l’estensione.

    Aggiungi questa stringa di codice al tuo e dovrebbe fare il trucco.

      

    Ho avuto lo stesso problema, ho provato:

    • Control Shift R,
    • Disabilita cache in F12
    • Controllo F5.

    Poi ho scoperto che l’uso di un manifest .appcache per un sito non https è deprecato . Ho rimosso il mio file site.appcache e il suo riferimento nel tag html e ora vedo l’ultima versione di ogni pagina!

    Ero in una situazione in cui il browser caricava i dati della cache dal disco anche se ho controllato la cache disabilitata (stavo usando Chrome). Tutti i miei css e js stavano caricando dal server ma non dalla pagina web. Questo stava accadendo sia sul mio locale che sulla produzione.

    Per ripararlo, ho bisogno di inserire un parametro extra nel mio url per forzare il browser ad ottenere la pagina web dal server, anche se il controller non ne ha avuto bisogno.

    Stavo usando ASP.Net, quindi ecco il mio esempio

     //Controller function public ActionResult Index() { return View(); } //Link @Html.Action("Index", "Home", new { ts = DateTime.Now.Ticks.ToString()}) 

    Il risultato è che genererà un collegamento come: http://www.myweb.com/Home/Index?ts=636558555408282209

    Questa è la mia situazione e soluzione. Spero che possa aiutare qualcuno.

    Uso (in Windows), ctrl + mai + cancella e quando viene visualizzata la finestra di dialogo Chrome, premere il tasto Invio. Questo può essere configurato con ciò che deve essere cancellato ogni volta che si esegue questa sequenza. Non c’è bisogno di avere dev. strumenti aperti in questo caso.