Erzwingen Sie bei Google Chrome die Möglichkeit, bei jedem Zugriff auf eine Website nach neuen JavaScript-Dateien zu suchen

5872
EJoshuaS

Wenn ich also zu Internetoptionen in Internet Explorer gehe: Erzwingen Sie bei Google Chrome die Möglichkeit, bei jedem Zugriff auf eine Website nach neuen JavaScript-Dateien zu suchen

Ich kann die Einstellungen anpassen, wenn der IE nach Updates sucht: Erzwingen Sie bei Google Chrome die Möglichkeit, bei jedem Zugriff auf eine Website nach neuen JavaScript-Dateien zu suchen

Kann ich in Google Chrome etwas Ähnliches machen? Wenn ich jetzt meine JavaScript-Datei ändere und von Visual Studio aus debugge, verwendet Chrome immer die zwischengespeicherte Version und nicht die geänderte Version. Um die aktuelle Version verwenden zu können, muss ich meine temporären Internetdateien / Cache manuell löschen, was wirklich ärgerlich ist.

26
Warum deaktivieren Sie nicht stattdessen die Zwischenspeicherung von Visual Studio? (Ernsthaft, wer zum Teufel entwirft eine IDE mit Zwischenspeicherung?) jpmc26 vor 7 Jahren 13
@ jpmc26 Was für eine Zwischenspeicherung? EJoshuaS vor 7 Jahren 1
Ich habe meinen letzten Kommentar lose formuliert; Ich entschuldige mich, wenn das unklar war. Browser zwischenspeichern nur Dateien, wenn der Server bestimmte Header zurücksendet. Es ist dumm, dass der Entwicklungsserver von Visual Studio standardmäßig Cache-Header zurücksendet, da Änderungen an diesen Dateien * erwartet * sein sollten. Das Laden der Seite dauert eine Sekunde, und es lohnt sich nicht, Probleme mit veralteten JS- und CSS-Dateien zu lösen, die im Browser zwischengespeichert werden. Ich hoffe aufrichtig, dass es eine Möglichkeit gibt, sie zu deaktivieren. jpmc26 vor 7 Jahren 20
Es wurden keine Visual Studio-Optionen gefunden, aber eine Änderung der Entwicklung web.config kann das Zwischenspeichern in Visual Studio beheben. https://www.iis.net/configreference/system.webserver/staticcontent/clientcache GER vor 7 Jahren 1
Die Chrome-Erweiterung "Cache Killer" hat es für mich gelöst, ich weiß nicht warum, aber Strg + F5 funktioniert manchmal nicht für mich flagg19 vor 7 Jahren 1
Wenn Sie in der Entwicklung sind, kann es nützlich sein,? V = hinzuzufügenzur URL für jede JS-Datei. Dies hat den Vorteil, dass bei der Bereitstellung Ihrer App schlecht verhaltene Cache-Server in der Wildnis zerstört werden. Andy vor 7 Jahren 1
@ jpmc26 Meine Erfahrung ist, dass Browser (und / oder Proxies und andere Bits, die sich "in die Quere kommen") sicherlich zwischenspeichern können, selbst wenn Header vorhanden sind (siehe [diese Frage und Antworten]) (http: //stackoverflow.com/q/49547/2096401) für eine scheinbar gute Studie darüber, wie man versuchen kann, dies für verschiedene Browser zu steuern. TripeHound vor 7 Jahren 1
Überprüfen Sie dies, wenn Sie etwas Freizeit haben: http://stackoverflow.com/questions/11245767/is-chrome-ignoring-control-cache-max-age Renan vor 7 Jahren 1
@TripeHound Wenn der Server keine Cache-Header angibt, wird der Inhalt jedes Mal neu geladen. Nicht zwischenspeichern ist wörtlich die Standardeinstellung. jpmc26 vor 7 Jahren 0

5 Antworten auf die Frage

54
Steven

Option 1: Cache vorübergehend deaktivieren

  1. Entwickler-Tools öffnen (Presse F12oder Menü, Weitere Tools, Entwickler-Tools)
  2. Öffnen Sie die Einstellungen der Entwicklertools (Presse F1oder DevTools-Menü, Einstellungen).
  3. Aktivieren Sie "Cache deaktivieren (während DevTools geöffnet ist)" unter der Kopfzeile "Network" des Voreinstellungsfensters

Option 2: Cache für Sitzung deaktivieren

Starten Sie Chrome mit den Befehlszeilenoptionen, mit --disk-cache-size=1 --media-cache-size=1denen die Caches auf 1 Byte begrenzt werden, wodurch der Cache effektiv deaktiviert wird.

Option 3: Manuelle Aktualisierung der Force

Laden Sie die aktuelle Seite neu und ignorieren Sie den zwischengespeicherten Inhalt: Shift+ F5oder Ctrl+ Shift+r

Chrome-Tastaturkürzel - Chrome-Hilfe (Unter "Webseiten-Verknüpfungen")

Option 4: Zusätzliche Nachladeoptionen ( Quelle )

Klicken Sie bei geöffneten Entwicklertools mit der rechten Maustaste auf die Schaltfläche "Neu laden", um ein Aktualisierungsmenü mit den folgenden Optionen anzuzeigen:

  • Normales Nachladen (Strg + R)
  • Hartes Nachladen (Strg + Umschalt + R)
  • Leerer Cache und Hard Reload
@Bruno Odd, ich habe auch immer Strg + F5 verwendet. Nur getestet und beide scheinen zu funktionieren. Jeroen vor 7 Jahren 1
Ich schlage vor, Option 2 mit einer Wendung zu verwenden. Machen Sie mit den Schaltern eine eigene Verknüpfung zu Chrome und benennen Sie sie anders. Legen Sie es an verschiedenen Enden Ihrer Windows-Taskleiste ein. Christopher Hostage vor 7 Jahren 0
8
fred beauchamp

Es kann nicht zu 100% auf die Chromauffrischung bezogen sein, sondern für die weitere Entwicklung. Wie @Dom gesagt hat, können Sie nach Ihrer Ressource ein? V = # hinzufügen. Eine Möglichkeit, den Prozess zu automatisieren, besteht darin, den Inhalt der Datei zu hashieren und diesen als Version zu verwenden.

Ich habe einen Snippet-Code, wie dies in C # (Razor for Implementation) geschieht, wenn dies helfen kann.

Helfer:

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"; } 

Implementierung:

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

Hoffe das hilft

BEARBEITEN --- Einige haben nach etwas Build-Laufzeit gefragt und für 1000 kleine Ressourcen dauert es ungefähr 11 ms.

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

https://de.code-bude.net/wp-content/uploads/2013/08/md5_performance_benchmark_2.png

Die Versionierung von Ressourcen wie dieser (oder durch Einbetten der Version / des Hashes in den Ressourcennamen selbst) kann sehr hilfreich sein, insbesondere wenn Updates in der realen Welt bereitgestellt werden, wo entgegen den Regeln des Cache-Control-Headers alle Möglichkeiten gelten Das Zwischenspeichern kann passieren, und viele Benutzer wissen nicht, wie sie den Cache aktualisieren müssen (oder müssen). Wenn Sie Ihre App nach einer neu benannten Ressource fragen, kann diese möglicherweise nicht zwischengespeichert werden. TripeHound vor 7 Jahren 2
Ist das nicht ein großer Leistungsverlust? Hasht jede CSS- und JS-Datei jedes Mal, wenn ein Link in eine Seite eingefügt wird ... Haben Sie Benchmarks dafür erstellt? Raidri vor 7 Jahren 1
@Raidri Hashing on the fly ist wahrscheinlich keine gute Idee (ich hatte nicht bemerkt, dass es das tat, als ich es zum ersten Mal kommentierte). Das Aktualisieren von Referenzen zur Verwendung eines Hash oder einer Version während des Erstellungsprozesses ist. TripeHound vor 7 Jahren 2
@Raidri Ich habe eine ziemlich kleine Anwendung mit 20 Ressourcen, die ich hasse und ich habe keinen Unterschied in der Bauzeit gesehen, also habe ich nicht wirklich versucht, sie zu vergleichen. Ich bin mir auch nicht sicher, ob ich Ihren zweiten Satz verstehe, aber die Ressourcen werden zwischengespeichert und der Browser speichert sie nur dann neu, wenn der Hash geändert wird =>, wenn Sie die Ressource selbst ändern. fred beauchamp vor 7 Jahren 0
Der Hash wird nicht zum Erstellungszeitpunkt berechnet, sondern bei jeder Seitengenerierung. Dies ist ein Serverproblem und hat nichts mit dem Zwischenspeichern im Browser zu tun. Raidri vor 7 Jahren 0
Sie haben im Grunde ein CSS und ein Js pro Seite, die Hashing erfordern, also ist es hier wirklich eine Frage von ms. fred beauchamp vor 7 Jahren 0
5
Dom

In anderen Fällen, in denen dies möglicherweise nicht möglich ist, z. B. eine Aktualisierung auf dem Computer eines Endbenutzers erzwingen möchten, auf die Sie keinen Zugriff haben, können Sie dem Skriptnamen eine Versionsnummer als Abfrageparameter anhängen, die den Browser identifiziert es als eine andere Datei . dh. example.js?v=1. Denken Sie daran, dass Sie die Anzahl bei jedem Neuladen ändern müssen, um sie zu erzwingen.

Sie könnten dies auch mit der lokalen Entwicklung tun, aber die Methode der Entwicklungswerkzeuge ist wesentlich effizienter.

3
Leze

Wenn Sie die Developer Tools Console öffnen, können Sie zusätzlich zur @Steven-Antwort mit der rechten Maustaste auf die Schaltfläche Aktualisieren klicken und das Dropdown-Menü verwenden.

In diesem Menü erhalten Sie eine Option zum "Leeren von Cache und Nachladen" .

Ist was Sie suchen.

Ich gehe davon aus, dass Sie eine nicht englische Version von Chrome verwenden. Ich benutze die englische Version und heißt "Empty Cache and Hard reload". Nzall vor 7 Jahren 1
Du hast recht, danke für das richtige Etikett Leze vor 7 Jahren 1
1
AgilePro

Wenn Sie die Site entwickeln, sollten Sie wissen, dass für Chrome die must-revalidateEinstellung erforderlich ist, Cache-Controlum Dateien ordnungsgemäß neu abzurufen, wenn sie auf dem Server geändert werden.

In den anderen Antworten erfahren Sie, wie Sie mit SHIFT-F5 Ihre eigene Version von Chrome dazu zwingen, alle Dateien erneut abzurufen. Aber ist es vernünftig, alle Benutzer der Site dazu aufzufordern, dies bei jeder Änderung der Site zu tun? Wenn Sie Cache-Controleinschließen, must-revalidatewird Chrome prüfen, ob sich Dateien geändert haben, und sie bei Bedarf ordnungsgemäß herunterladen.

Details finden Sie in diesem Blogeintrag: https://agiletribe.wordpress.com/2018/01/29/caching-for-chrome/