Forza Google Chrome a verificare la presenza di nuovi file JavaScript ogni volta che accedo a un sito Web


25

Quindi, se vado alle opzioni Internet in Internet Explorer: inserisci qui la descrizione dell'immagine

Posso regolare le impostazioni per quando IE verifica la presenza di aggiornamenti: inserisci qui la descrizione dell'immagine

Posso fare qualcosa di simile in Google Chrome? In questo momento, quando cambio il mio file JavaScript ed eseguo il debug da Visual Studio, Chrome utilizzerà sempre la versione cache anziché utilizzare la versione modificata. Per poter utilizzare la versione corrente devo cancellare manualmente i miei file / cache temporanei di Internet, il che è davvero fastidioso.


14
Perché invece non disabiliti la memorizzazione nella cache eseguita da Visual Studio? (Seriamente, chi diavolo progetta un IDE con memorizzazione nella cache?)
jpmc26

2
@ jpmc26 What caching?
EJoshuaS - Ripristina Monica il

21
Ho formulato il mio ultimo commento liberamente; le mie scuse se ciò ha reso poco chiaro. I browser memorizzano nella cache i file solo se il server rispedisce intestazioni specifiche. È stupido che il server di sviluppo di Visual Studio rispedisca le intestazioni della cache per impostazione predefinita, poiché dovrebbero essere previste modifiche a tali file . Vale la pena dedicare una seconda parte in più al caricamento della pagina senza problemi con file JS e CSS obsoleti che vengono memorizzati nella cache nel browser. Spero sinceramente che ci sia un modo per disabilitarlo.
jpmc26,

1
Impossibile trovare le opzioni di Visual Studio ma una modifica dello sviluppo web.config potrebbe risolvere la memorizzazione nella cache in Visual Studio. iis.net/configreference/system.webserver/staticcontent/…
GER

1
L'estensione di Chrome "Cache Killer" l'ha risolto per me, non so perché ma ctrl + f5 a volte non funziona per me
flagg19

Risposte:


55

Opzione 1: disabilitare temporaneamente la cache

  1. Apri strumenti per sviluppatori (stampa F12o menu, Altri strumenti, Strumenti per sviluppatori)
  2. Apri le impostazioni degli strumenti di sviluppo (premi F1o il menu DevTools, Impostazioni)
  3. Selezionare "Disabilita cache (mentre DevTools è aperto)" nell'intestazione Rete del riquadro Preferenze

Opzione 2: disabilitare la cache per la sessione

Avvia Chrome con le opzioni della riga di comando --disk-cache-size=1 --media-cache-size=1che limiteranno le cache a 1 byte, disabilitando efficacemente la cache.

Opzione 3: aggiornamento forzato manuale

Ricarica la pagina corrente, ignorando il contenuto memorizzato nella cache: Shift+ F5o Ctrl+ Shift+r

Scorciatoie da tastiera di Chrome - Guida di Chrome (in "Scorciatoie di pagine Web")

Opzione 4: Opzioni di ricaricamento extra ( sorgente )

Con gli Strumenti per sviluppatori aperti, fai clic con il pulsante destro del mouse sul pulsante Ricarica per visualizzare un menu di ricarica con il seguente:

  • Ricarica normale (Ctrl + R)
  • Ricarica dura (Ctrl + Maiusc + R)
  • Cache vuota e Ricarica dura

1
@Bruno Odd, ho sempre usato anche ctrl + f5. Appena testato ed entrambi sembrano funzionare.
Jeroen,

Suggerisco di usare l'opzione 2, con una svolta. Crea una scorciatoia separata per Chrome con le opzioni e assegnale un nome diverso. Mettilo in diverse estremità della barra delle applicazioni di Windows.
Christopher Hostage,

8

Potrebbe non essere correlato al 100% all'aggiornamento di Chrome, ma per ulteriore sviluppo. Come ha detto @Dom, puoi aggiungere un? V = # dopo la tua risorsa. Un modo per automatizzare il processo consiste nell'hash del contenuto di detto file e utilizzarlo come versione.

Ho un codice frammento su come farlo in C # (Rasoio per l'implementazione) se questo può aiutare.

helper:

public static string HashUrl(string relativeUrl)
    {
        var server = HttpContext.Current.Server;
        if (File.Exists(server.MapPath(relativeUrl)))
        {
            byte[] hashData;
            using (var md5 = MD5.Create())
            using (var stream = File.OpenRead(server.MapPath(relativeUrl)))
                hashData = md5.ComputeHash(stream);

            return relativeUrl.Replace("~", "") + "?v=" + BitConverter.ToString(hashData).Replace("-", "");
        }
        return relativeUrl + "?v=notFound";
    }

Implementazione:

<link rel="stylesheet" href=@Util.HashUrl("~/Controllers/Home/Views/Index.css") />

Spero che sia di aiuto

EDIT --- Alcuni hanno richiesto un po 'di tempo di esecuzione e per 1000 piccole risorse, ci vogliono circa 11 ms.

https://en.code-bude.net/2013/08/07/md5-hashes-in-c-benchmark-and-speed-%E2%80%8B%E2%80%8Boptimization/

inserisci qui la descrizione dell'immagine https://en.code-bude.net/wp-content/uploads/2013/08/md5_performance_benchmark_2.png


2
Le risorse di versioning come questa (o incorporando la versione / hash nel nome della risorsa stessa) possono essere molto utili, specialmente quando si distribuiscono aggiornamenti nel mondo reale, dove - contrariamente a quanto dicono le regole sull'intestazione di controllo della cache - in tutti i modi della memorizzazione nella cache potrebbe verificarsi e molti utenti non sapranno come (o necessità) aggiornare la cache. Se (crei la tua app) richiedi una risorsa appena nominata, non può essere memorizzata nella cache.
TripeHound,

1
Non è una grande perdita di prestazioni? Hashing di ogni file css e js ogni volta che viene inserito un link in una pagina ... Hai eseguito benchmark per questo?
Raidri dice di reintegrare Monica il

2
@Raidri Hashing al volo probabilmente non è una buona idea (non avevo notato che lo stava facendo quando ho commentato per la prima volta). L'aggiornamento dei riferimenti per utilizzare un hash o una versione durante il processo di compilazione è.
TripeHound,

@Raidri Ho un'applicazione piuttosto piccola con circa 20 risorse che ho e non ho visto differenze nel tempo di costruzione, quindi non ho davvero provato a confrontarlo. Inoltre non sono sicuro di aver compreso la tua seconda frase, ma le risorse sono memorizzate nella cache e il browser le memorizza solo se l'hash cambia => se cambi la risorsa stessa.
fred beauchamp,

L'hash non viene calcolato al momento della creazione ma ad ogni generazione di pagina. Questo è un problema del server e non ha nulla a che fare con la memorizzazione nella cache nel browser.
Raidri dice di reintegrare Monica il

5

In altri casi in cui questi potrebbero non essere possibili, ad esempio se si desidera forzare un aggiornamento sul computer di un utente finale a cui non si ha accesso, è possibile aggiungere un numero di versione al nome dello script come parametro di query per identificare il browser come un file diverso . vale a dire. example.js?v=1. Tieni presente che dovrai modificare il numero su ogni ricarica per forzarlo.

Potresti anche farlo con lo sviluppo locale, ma il metodo degli strumenti di sviluppo è molto più efficiente.


3

oltre alla risposta di @Steven, quando si apre la Console degli strumenti per gli sviluppatori , è possibile fare clic con il pulsante destro del mouse sul pulsante di aggiornamento e utilizzare il menu a discesa.

In questo menu è disponibile un'opzione per "Svuota cache e Ricarica dura" .

È quello che stai cercando.


1
Presumo che tu stia utilizzando una versione non inglese di Chrome. Uso la versione inglese e si chiama "Svuota cache e Ricarica dura".
Nzall,

1

Se stai sviluppando il sito, dovresti sapere che Chrome richiede l' must-revalidateimpostazione Cache-Controlper poter recuperare correttamente i file quando vengono modificati sul server.

Le altre risposte ti dicono come premere SHIFT-F5 per forzare la tua versione di Chrome a recuperare tutti i file. Ma è ragionevole dire a tutti gli utenti del sito di farlo ogni volta che il sito cambia? Se imposti Cache-Controll'inclusione, must-revalidateChrome verificherà se sono stati modificati dei file, quindi scaricarli correttamente quando necessario.

Vedi i dettagli in questo post del blog: https://agiletribe.wordpress.com/2018/01/29/caching-for-chrome/

Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.