Wie kann ich das Browser- und Server-Caching von CSS-Dateien verhindern?

Verhindern des Browser- und Server-Caching von CSS-Dateien

Bei der Entwicklung einer Website ist es oft frustrierend, CSS-Änderungen vorzunehmen, die sich nicht sofort widerspiegeln im Browser. Dies ist wahrscheinlich auf das Caching sowohl durch den Browser als auch durch den Server zurückzuführen.

Cachet Apache CSS-Dateien?

Ja, Apache speichert standardmäßig Ressourcen im Cache. Um zu überprüfen, ob Ihr Apache-Server CSS-Dateien zwischenspeichert, können Sie das Debuggen aktivieren, indem Sie die folgende Zeile zu Ihrer .htaccess-Datei hinzufügen:

LogFormat "%r %s %b %H" debuglog
CustomLog "| tail -f /dev/stderr -" debuglog

Laden Sie die Seite neu und überprüfen Sie das Debug-Protokoll auf die folgende Zeile:

GET /css/main.css 200 7122 0

Die letzte Zahl, „0“, gibt an, dass die Datei aus dem Cache bereitgestellt wurde.

Caching verhindern

Es gibt mehrere Methoden dazu Zwischenspeicherung von CSS-Dateien verhindern:

1. Hängen Sie eine Abfragezeichenfolge an den Dateinamen an

Sie können eine zufällige Abfragezeichenfolge an das Ende des CSS-Dateinamens anhängen und so den Browser zwingen, die Datei herunterzuladen, anstatt die zwischengespeicherte Version zu verwenden. Zum Beispiel:

<link rel="stylesheet" type="text/css" href="style.css?v=2" />

2. Verwenden Sie einen Cache-Control-Header

Sie können der HTTP-Antwort einen „Cache-Control“-Header hinzufügen, der angibt, wie lange der Browser die Datei zwischenspeichern soll. Zum Beispiel:

header("Cache-Control: no-cache, no-store, must-revalidate");
header("Pragma: no-cache");

3. Verwenden Sie mod_headers in Apache

Für Apache-Server können Sie das Modul mod_headers verwenden, um Caching zu verhindern. Fügen Sie die folgende Zeile zu Ihrer .htaccess-Datei hinzu:

Header set Cache-Control "max-age=0, s-maxage=0, must-revalidate"

4. Rufen Sie CSS mit einer Versionsnummer auf

Ein gängiger Ansatz vieler Websites besteht darin, CSS mit einer Versionsnummer aufzurufen. Wenn Sie das CSS aktualisieren, erhöhen Sie die Versionsnummer, wodurch Browser gezwungen werden, die neue Datei zu laden. Zum Beispiel:

<link rel="stylesheet" type="text/css" href="style.css?v=1" />

Wenn Sie das CSS aktualisieren, ändern Sie „v=1“ in „v=2“.

Durch die Implementierung einer oder mehrerer dieser Methoden können Sie dies sicherstellen Ihre CSS-Änderungen werden sofort im Browser angezeigt, auch auf Produktionsservern.

Das obige ist der detaillierte Inhalt vonWie kann ich das Browser- und Server-Caching von CSS-Dateien verhindern?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!