Warum ignoriert der Server Änderungen in den Codedateien, obwohl der Cache deaktiviert ist?

14

Ich teste einen HTML / JS-Code auf meinem lokalen Host (Windows 7, Chrome v79.0.3945.130 (64-Bit)) und ungefähr 50% der Änderungen des Zeitcodes werden nicht im Browser angezeigt (ich sehe ihn mit Dev Tools / Sources) ).
Es gibt eine Menge Ratschläge im Internet, aber keiner scheint zu funktionieren:

Klicken Sie mit der rechten Maustaste auf das Neuladen und wählen Sie "Cache leeren und hart neu laden" - hilft in 30% der Fälle nicht.
Cache auf der Registerkarte "Netzwerk" der Chrome Dev Tools deaktivieren - hilft nicht.
Fügen Sie <meta http-equiv="Cache-control" content="no-cache">in der Kopfzeile - nicht hilft.
Ersetzen <script src="common.js"></script>durch <script src="common.js?blabla"></script>- hilft in 60% der Fälle, aber Sie müssen es tun, nachdem jede Änderung eine große Aufgabe ist. Außerdem funktioniert es nicht mit HTML-Änderungen.
Kopieren Sie eine Datei in eine neue Datei (wie index.html in index2.html) und ersetzen Sie den Dateinamen im Code - funktioniert immer, ist aber eine noch größere Aufgabe.

Das gleiche Problem tritt auf, wenn ich den Code an github.io festschreibe

Bitte helfen Sie mir dabei, damit die Website die Codeänderungen sofort widerspiegelt.

Bearbeiten: Ich habe eine Datei index3.html erstellt und dort nur "Hallo Welt" abgelegt. Öffnete die Datei im Browser. Geändert zu "Hallo Welt2" - der Browser hat den Inhalt aktualisiert. Geändert zu "Hallo Welt3" - der Browser zeigte auch nach mehreren Neuladungen und "Leeren Cache und hartes Neuladen" immer noch "Hallo Welt2" an. Ich habe zu "Hallo Welt4" gewechselt - der Browser zeigte immer noch "Hallo Welt2" an. In 4 Stunden wechselte ich zu "Hallo Welt5" - der Browser zeigt immer noch "Hallo Welt2". Diese Datei habe ich mit Basic Notepad bearbeitet.

Edit2: Die Leute fragen immer wieder, welchen Server ich benutze. Dies scheint ein Teil des Problems zu sein. Leider weiß ich es nicht und ich weiß auch nicht genau, was ich tun muss, um es zu überprüfen. Hier ist alles, was ich bisher herausgefunden habe:

Ich habe ein inetpub/wwwrootVerzeichnis, in dem ich HTML- und JS-Dateien ablege und dann index.html in einem Browser unter öffne http://localhost/.
Mein Netzwerkfenster in Devs Tools sieht folgendermaßen aus: Bildlink .
Das Server-Setup war sehr schnell und erforderte keine zusätzliche Software zur Installation. Dh ich benutze nicht node.js.
Es gibt iisstart.htm bei inetpub/wwwrootund wenn ich es öffne http://localhost/iisstart.htm, steht IIS7.

— klm123
quelle

Ich finde manchmal das Deaktivieren des Caches in Chrome Dev Tools + Aktualisieren + erneutes Aktivieren des Caches + Aktualisieren behebt manchmal das Problem? Könnte einen Versuch wert sein ...

— Nick Parsons

2

Welchen Servertyp verwenden Sie?

— Jhecht

@Jhecht wie überprüfe ich das?

— klm123

1

Nach dem, was ich in den Antworten sehe, werden Sie es wahrscheinlich mit einem Parameter umgehen. Und das wird wahrscheinlich funktionieren. Normalerweise sollte dies jedoch nicht erforderlich sein, wenn Sie den Cache in Chrome Dev Tools deaktivieren. Meine Vermutung wäre also, dass es sich um einen weiteren Cache handelt. Zwischen Ihnen und dem Server kann sich eine beliebige Anzahl zusätzlicher Caching-Technologien befinden. Einige Beispiele: Server-seitiges Caching (z. B. Varnish), CDN-Caching (z. B. Cloudflare), lokale Proxys von Router / Firewalls (z. B. Squid-Cache) und ähnliche Dinge. Ich würde auch danach suchen.

— Jey DWork

1

@ klm123 Ohne zu wissen, um welchen Webserver es sich handelt, kann man nicht sagen, wie man die Cache-Konfiguration dafür ändert oder überprüft. Wenn Sie keine Ahnung von Ihrem Webserver haben, können Sie dies auf der Registerkarte "Netzwerk" der devTools überprüfen: Überprüfen Sie die Antwortheader des geladenen Servers auf index.htmleinen X-Powered-Byoder einen ServerHeader, der möglicherweise einen Hinweis auf den Webserver gibt. Das Googeln nach Ihrem Dateipfad inetpub/wwwrootverweist stark auf einen IIS-Server.

— Acran

6

Die Verwendung eines Parameters ist der richtige Weg! Hier können Sie eine Versionsnummer hinzufügen, die Sie nur bei großen Änderungen manuell ändern, und zum Debuggen können Sie sie auf Date.time () setzen. In Ihrem <head> -Tag werden daher alle zwischengespeicherten Versionen überschrieben, da der Parameter immer neu ist einer:

< script type="text/javascript"> 
    var script = document.createElement('script'); 
    var version = Date.time();
    script.src = "common.js?v="+version; 
    document.head.appendChild(script) 
< /script>

Hoffe das hilft!

— lehm.ro
quelle

Ich denke ich kann es schaffen. Aber ist es nicht effektiv dasselbe wie meine vierte Option? nach dem Dateinamen "? blabla" hinzufügen. Es funktioniert nicht oft - es ist entweder derselbe Dateiname auf der Registerkarte "Quellen" oder es wird blabla hinzugefügt, aber der Inhalt der Datei ist immer noch der gleiche.

— klm123

Es ist nicht das gleiche. Sobald ein Parameter zweimal verwendet wird (was mit Date.time () niemals passieren wird, wird möglicherweise eine zwischengespeicherte Version gerendert.? Blabla ist nach zweimaliger Verwendung dieselbe wie überhaupt nicht.

— lehm.ro

Parameter wird nicht zweimal verwendet. Ich bearbeite Code, ändere dann den Parameter, überprüfe dann den Quellcode im Browser und es ist der alte.

— klm123

Hast du meinen Ansatz ausprobiert?

— lehm.ro

Ihr Ansatz hilft, danke. Aber es löst mein Problem nicht. Was Sie geschrieben haben, stimmt in meiner Situation nicht. "Erzwingt das Überschreiben aller zwischengespeicherten Versionen, da der Parameter immer neu ist". Wenn Sie den Parameter in einen neuen ändern, wird mein Cache nicht gezwungen, zuverlässig neu zu laden. Es kann auch nicht bei Änderungen in index.html helfen.

— klm123

3

In IIS7 Windows Server unter Windows 7 müssen Sie einige Änderungen an einer Ihrer aufgerufenen Konfigurationsdateien vornehmen, um das Zwischenspeichern Ihrer Inhalte zu verhindern web.config. Die Konfigurationsdateien für IIS 7 und später befinden sich in %WinDir%\System32\Inetsrv\Config folderdem %WinDir%der Ordner , in dem Sie Windows ( in der Regel installiert C:/Windows).

Erstellen Sie eine Sicherungskopie Ihrer web.config vor dem Bearbeiten Datei, damit Sie ein Rollback durchführen können, wenn die Änderungen, die Sie an der Datei vornehmen, diese beschädigen.

Fügen Sie in Ihrer web.configDatei einfach Folgendes hinzu, um das Zwischenspeichern Ihrer Datei zu verhindern index.html:

<?xml version="1.0" encoding="UTF-8"?>
<configuration>

  <location path="index.html">
    <system.webServer>
      <httpProtocol>
        <customHeaders>
          <add name="Cache-Control" value="no-cache" />
        </customHeaders>
      </httpProtocol>
    </system.webServer>
  </location>

</configuration>

Habe den Dateipfad für die web.configDatei von hier bekommen: Windows Doc: Konfigurationsreferenz

Die Konfiguration für den obigen Cache finden Sie hier: Wie deaktiviere ich das Caching von HTML-Dateien für Einzelseitenanwendungen, die über IIS bereitgestellt werden?

— AndrewL64
quelle

Unter dem angegebenen Pfad befindet sich keine web.config. Ich habe es erstellt und Ihren Code dort platziert. Aber ich musste index.html durch einen vollständigen Pfad wie ersetzen projectName/index.html, den ich von der URL in meinem Browser kopiere http:/localhost/projectName/index.html. Ergebnis - keine Auswirkung auf das Caching-Problem.

— klm123

@ kim123 Können Sie versuchen, die web.configDatei stattdessen im Stammordner Ihrer Site (Ordner, in dem sich Ihre Site befindet) hinzuzufügen und den Pfad zurück zu just zu ändern, um zu index.htmlsehen, ob dies funktioniert.

— AndrewL64

Ich tat. es hilft nicht.

— klm123

1

Ich hatte das gleiche Problem und dies ist meine Checkliste:

Überprüfen Sie web.config (Caching und Clientcache, Kernel-Cache-Richtlinie usw.) oder .htaccess (Header-Set Cache-Control).
Wenn Sie dynamische Sprachen wie ASP oder PHP verwendet haben, ist möglicherweise eine interne Cache-Einstellung vorhanden. In einem Fall fand ich <%Response.Expires=1440%>in vielen Zeilen ASP-Code und es wurden alle anderen Einstellungen überwunden! In PHP session_cache_expirekann das gleiche tun .
Wenn Sie IIS verwenden, überprüfen Sie die Header Server > HTTP-Antwort , um sicherzustellen, dass das Zwischenspeichern auch für einzelne Websites, die unter dem Servernamen aufgeführt sind, nicht gleich ist.
Check http-equiv="Cache-control"in HTML - Header (Sie hat diesen Test bestanden!).

Schließlich muss ich , dass oben in allen Situationen sagen, Auf Disable Cache in newtwork Tab in Chrome Konsole immer für mich gearbeitet , um eine frische Version von Seiten anzuzeigen aber das ist gut nur für die Zwecke und Besucher Debuggen wird nicht das tun!

— Ali Sheikhpour
quelle

1. Wo finde ich web.config und .htaccess? 2. Ich benutze nur HTML und JS. 3. HTTP- Antwortheader sehen

— folgendermaßen aus

Wenn Sie IIS verwenden, befindet sich die Datei web.congfig im Stammverzeichnis von wwwroot. Außerdem gibt es auf Serverebene die Datei Machine.config, die Sie direkt von hier aus über die IIS-Konsole ändern können: stackoverflow.com/questions/2325473/where-is-machine-config . Wenn Sie einen Apache-Server unter Windows verwenden, suchen Sie bitte unter Windows nach .htaccess @ klm123

— Ali Sheikhpour,

0

Versuchen Sie in dem speziellen Fall, in dem Sie Google Chrome verwenden, Folgendes: Öffnen Sie die Entwicklungstools -> Gehen Sie zur Registerkarte "Netzwerk". Aktivieren Sie das Kontrollkästchen "Cache deaktivieren" und aktualisieren Sie anschließend die Seite.

HINWEIS: Damit dies jedes Mal funktioniert, MUSS das Dev Tools-Fenster immer geöffnet bleiben.

Um jedoch Änderungen an Ihre Benutzer weiterzugeben, ohne dass diese die Seite usw. hart aktualisieren müssen, müssen Sie am Ende jeder referenzierten Datei Dateiversionen für Dateien anhängen, die sich häufig ändern (wie Sie bereits betont haben). Zum Beispiel:

<link rel="stylesheet" type="text/css" href="https://cdn.sstatic.net/Sites/stackoverflow/primary.css?v=20b379f72a37" >

Das v=20b379f72a37an das Ende angehängte ist ein automatisch generierter Datei-Hash des Dateiinhalts.

— Martin Shishkov
quelle

Das ist der Punkt 2 in meiner Liste.

— klm123

Stellen Sie sicher, dass das Dev Tools-Fenster geöffnet bleibt?

— Martin Shishkov

Das Fenster mit den Entwicklungswerkzeugen ist geöffnet, das Kontrollkästchen ist aktiviert [aber ich schaue normalerweise auf die Registerkarte Quellen] und ich aktualisiere sogar hart.

— klm123

0

Dies ist ein langer Weg - aber welche Art von Editor / IDE verwenden Sie? Welche Art von Änderungen nehmen Sie an Ihrer index.html vor?

Können Sie einige Beispiele für solche Änderungen angeben, die beim Speichern und Laden der Datei nicht berücksichtigt werden?

Ich möchte versuchen, Ihr Problem zu reproduzieren. Nach den Vorschlägen der Leute scheint das Problem nicht im Code selbst zu liegen. Ich vermute, dass es sich um ein Umweltproblem handelt, aber ich benötige weitere Informationen von Ihnen, um meinen Verdacht zu bestätigen.

— Foreza
quelle

Ich verwende Microsoft Visual Studio Code. Beispiel: Ersetzen Sie <script src = "common.js"> </ script> durch <script src = "common.js? Blabla">. Beispiel 2: Fügen Sie eine neue Schaltfläche hinzu, fügen Sie ein neues div hinzu und fügen Sie einen Onload-Funktionsaufruf hinzu. Tbh es sieht aus wie jede Art von Änderungen.

— klm123

Siehe die Änderungen am Ende meines Fragenposts.

— klm123

0

Was Sie in HTML-Meta schreiben, ist eine Empfehlung an Browser, keine strenge Anweisung. Wenn das strikte Caching im Browser aktiviert ist, hilft dies nicht.

Die Lösungen sind gut beschrieben: https://curtistimson.co.uk/post/front-end-dev/what-is-cache-busting/

Ich bevorzuge es auf der Serverseite, den Skripten die Version mit dem Datum der letzten Aktualisierung der Datei selbst hinzuzufügen.

<script src="/myScript.js?v=1579780745150"></script>

Wo 1579780745150 ist Unix Timestamp aktualisiert die Datei myScript.js selbst. Es funktioniert nur mit eigenen Dateien, externe werden jedoch nicht benötigt. Am häufigsten im Dateinamen ist die Version.

— Aleksandr Smityukh
quelle

Wenn Sie den Code des Backends benötigen. Sag mir, welche Plattform du benutzt hast.

— Aleksandr Smityukh

0

Das ist wahrscheinlich sehr frustrierend und es hört sich nicht so an, als würden Sie etwas falsch machen.

Das Problem ist wahrscheinlich, dass etwas zwischen Ihrem Browser und der Skriptdatei, die Sie aufrufen, Caching ausführt.

Um festzustellen, was es ist, möchte ich fragen, wie Sie zur localhost-URL navigieren.

Beispiele:

file://path/to/file.html
http://localhost/file.html
http://127.0.0.1/file.html
http://[machine's-hostname]/file.html
http://[custom-domain-defined-in-hosts-file]/file.html

Wenn Sie ausgeführt werden, file://path/to/file.htmlbedeutet dies, dass Sie nicht über einen Webserver / Proxy navigieren. Wenn jahttp://[something]/file.html dann betreiben Sie eine Art Webserver, und das ist wahrscheinlich der Schuldige. Suchen Sie nach einer Einstellung, in der Sie das Caching deaktivieren können.

Wenn Sie keinen Webserver verwenden und buchstäblich direkt zu einer lokalen HTML-Datei ohne Webserver navigieren, würde ich vorschlagen, dass der Browser der Schuldige ist. Wenn dies der Fall ist, würde ich vorschlagen, das Browser-Caching zu deaktivieren, wie es Martin Shishkov vorgeschlagen hat.

— Dean Householder
quelle

es ist http://localhost/ProjectName/index.htmlWo diese Einstellung , wo Sie aufge Caching drehen kann sein kann?

— klm123

Aus dem Screenshot, den Sie an anderer Stelle veröffentlicht haben, geht hervor, dass Sie IIS (auch als Internetinformationsdienste von Microsoft bezeichnet) verwenden. Eine schnelle Lösung besteht darin, einfach auf Ihre HTML-Datei zu doppelklicken, um sie in den Browser zu laden, der a verwendet file://path/to/projectName/index.html. Dadurch wird der Webserver aus der Gleichung entfernt. Informationen zur weiteren Verwendung von IIS und zum Beheben des Caches finden Sie in diesem Artikel: support.microsoft.com/en-us/help/247404/…

— Dean Householder

0

Chrome führt diese Aktion aus, bei der, wenn sich die Datei nicht zu stark geändert hat und nicht sicher ist, was dies bedeutet, die "kompilierte" Cache-Version verwendet wird. Für HTML bedeutet es analysierter Don-Baum. Für JS vorkompilierten Code usw.

Es gibt normalerweise Möglichkeiten, dies zu beheben. Viele Frameworks verwenden Hash in Dateinamen, wie z. main.md5hash.js Weil das Ändern des Dateinamens den Cache ungültig macht.

Dann bleibt Ihnen möglicherweise HTML nicht aktualisiert. Und um klar zu sein, ich bin mir nicht sicher, Sie können immer einen Kommentar mit einem zufälligen Blob hinzufügen ... wie ein Datum.

— Akxe
quelle

0

Basierend auf den Aktualisierungen Ihrer Antwort würde ich sagen, dass Ihr Problem durch IIS v7 verursacht wird , das Ihren PC- Speicher zum Zwischenspeichern verwendet, nicht Ihre lokale Festplatte, weshalbHard reload und alle anderen Methoden scheinen nicht richtig zu funktionieren.

Ich könnte mir 3 Lösungen vorstellen:

1. Behebung des IIS-Cache-Problems: (Nicht getestet, da ich keinen PC mit IIS habe.)

Von Anfang Menü auf Verwaltung , und klicken Sie dann auf Internetinformationsdienste (IIS) -Manager. (siehe Bilder )
Suchen Sie in der Baumansicht auf der linken Seite Ihre Anwendung.
Wählen Sie den Menüpunkt Output Caching .
Klicken Sie auf Cache-Regel hinzufügen und geben extensionSie die Dateien ein , für die Sie den Cache deaktivieren möchten .aspx, z. B. CSS, JS usw. (eine nach der anderen, denke ich?)
Jetzt können Sie entweder das Zwischenspeichern im Benutzermodus deaktivieren oder die Option Zwischenspeichern verhindern aktivieren . Es sollte ungefähr so aussehen:

Lösungsquelle - Lesen Sie mehr über den IIS 7-Cache

2. Verwenden einiger Alternativen zu IIS Es gibt einige, aber ich würde (basierend auf meinen Erfahrungen) WAMP oder XAMPP empfehlen. Beide bieten Ihnen eine bessere Entwicklungsumgebung und beide unterstützen Windows 7. Auch wenn Sie mit vertraut sind VS-Code Sie können einfach die Live Server- Erweiterung verwenden.

3. Verwenden Sie während der Entwicklung den Chrome Incognito- Modus. (Nicht sicher, ob es für IIS7 funktioniert)

— awran5
quelle

Cache-Regel hinzufügen / Alle Cachings verhindern - hilft nicht [versucht mit HTML]. Inkognito-Modus - hilft nicht.

— klm123

Haben Sie es mit .jsDateien versucht ? Es hängt davon ab, welche Änderungen Sie vornehmen.

— awran5