Warum wird mein Javascript und CSS nicht zwischengespeichert?

Question

Es scheint, dass NUR Javascript und CSS nicht zwischengespeichert werden ... aber Bilder werden zwischengespeichert.

Ich benutze Firebug und wenn ich die Seite aktualisieren, bemerke ich in Firebug eine Menge von 200 HTTP-Antworten für js/css, aber ich erhalte 304 HTTP-Codes (Inhalt nicht verändert) für alle meine Bilder. Es scheint also, dass mein JS und CSS nicht zwischengespeichert werden.

Auch bei der Verwendung von YSlow, um das Problem mit meinem JS/CSS-Inhalt nicht Zwischenspeichern zu bestimmen, informiert es mich, dass:

Es gibt 4 Komponenten mit falsch konfigurierten ETags

• http://www.example.com/css/basic.css
• http://www.example.com/js/ga.js
• http://www.example.com/js/dojo/dojo.js

Im Folgenden ist meine .htaccess-Datei aufgeführt

Options -Indexes
Options +FollowSymLinks  

# Enable ETag
FileETag MTime Size

# Set expiration header
ExpiresActive on
ExpiresDefault "access plus 1 week"

# Compress some text file types
AddOutputFilterByType DEFLATE text/html text/plain text/css text/xml application/x-javascript text/javascript application/javascript application/json

# Deactivate compression for buggy browsers
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ^Mozilla/4\.0[678] no-gzip
BrowserMatch \bMSIE !no-gzip !gzip-only-text/html

# Set header information for proxies
Header append Vary User-Agent

Jede Idee, was ist falsch mit meinem .htaccess Zugriffsdatei verhindert es von meinem CSS oder JavaScript Zwischenspeichern?

Answer 1

Bitte beachten Sie Deaktivierung von ETag's!

Betrachten Sie die folgenden Einstellungen:

Header unset ETag
FileETag None
Header set Cache-Control "max-age=2678400"

Die ersten beiden Regeln deaktivieren ETags vollständig, so dass der Browser gewissermaßen gezwungen ist, auf den Cache-Control-Header zu hören. Die letzte Regel weist den Browser an, die Datei 2678400 Sekunden oder 1 Monat lang zwischenzuspeichern. Passen Sie die Einstellungen so an, wie es Ihnen am besten passt. Wenden Sie diese Konfiguration auf Ihr Verzeichnis an, das die statischen Dateien enthält (indem Sie beispielsweise eine .htaccess-Datei in diesem Verzeichnis ablegen)

Optional, wenn Sie mehrere Server für die Bereitstellung statischer Inhalte verwenden und/oder sich nicht sicher sind, welche Zeitpunkte für die letzte Änderung von diesen Servern gemeldet werden, können Sie diese Option verwenden:

Header unset Last-Modified

Sie weist den Apache an, keine Last-Modified-Header zu liefern, so dass Browser nur auf den Cache-Control max-age-Header hören können.

Diese Einstellungen werden von mir auf vielen stark frequentierten Websites verwendet, und die Deaktivierung der ETag- und Last-Modified-Header hat mit Sicherheit dazu beigetragen, den Datenverkehr auf ein Fünftel des früheren Wertes zu senken. Insbesondere der Internet Explorer reagiert sehr empfindlich auf diese Einstellungen.

Seien Sie gewarnt: Die Deaktivierung von Last-Modified verhindert, dass die Browser 304 Content Not Modified-Anfragen stellen. Meiner Erfahrung nach ist dies positiv, da der Webserver weniger Anfragen zu verarbeiten hat und die Browser sich mehr auf die von Ihnen bereitgestellten Cache-Control-Einstellungen verlassen. Aber es kann sein, dass es Ihnen nicht passt. Einige Browser werden versuchen, die Inhalte alle paar Minuten zu überprüfen, wenn Sie ihnen einen "Last-Modified"-Header übermitteln, und deshalb würde ich empfehlen, die Verwendung dieses Headers vollständig zu deaktivieren.

Oh, und wenn Sie sich nicht sicher sind, wie Sie Ihr Caching gestalten, verwenden Sie http://www.redbot.org/ um Ihre Assets zu testen, erfahren Sie schnell, welche Bedeutung Ihre Header für einen Browser haben und wie die verschiedenen von Ihnen verwendeten Cache-Kontroll-Einstellungen zu interpretieren sind.

Answer 2

YSlow meldet falsch konfigurierte Etags, wenn sie nicht einem bestimmten Muster entsprechen. Da Sie die css und js komprimieren, werden die Etags etwa so ausgegeben:

Etag "1e10-4889909861a80"-gzip

Sehen Sie das -gzip am Ende der Datei? Es wird von Apache (nur Version 2) dort eingefügt. Das ist es, was den "Fehler" verursacht. YSlow erwartet so etwas wie das hier:

Etag "xxxx-xxxxxxxxxxxxx"

Im Grunde kann man das nicht reparieren, weil es nicht kaputt ist. Machen Sie sich also nicht verrückt, wenn Sie versuchen, eine perfekte Punktzahl zu erreichen, wenn Sie nicht wissen, was Sie tun. Sogar die Yahoo-Startseite bekommt nur eine 90.

Answer 3

Diese YSlow-Fehlermeldung ist extrem irreführend!

YSlow ist eigentlich sich darüber beschweren, dass Sie ETags verwenden überhaupt nicht!

YSlow läuft in Ihrem Browser - es hat keine Möglichkeit zu erkennen, ob ETags korrekt konfiguriert sind oder nicht. Als Faustregel kann man sagen, dass Sie ETags nicht verwenden sollten, weil es in einer Multi-Server-Umgebung wahrscheinlicher ist, dass sie falsch konfiguriert sind als richtig konfiguriert. (Und YSlow richtet sich an Benutzer mit großen Multi-Server-Websites.)

Wenn Sie mit einem einzelnen Server arbeiten, oder wenn Sie mit einem verteilten Server arbeiten, aber wissen, was Sie tun, dann sind ETags natürlich genau richtig. Aber YSlow hat keine Möglichkeit, dies zu wissen.

In den Kommentaren auf der Seite mit der Fehlerbeschreibung, die Sie sich ansehen sollten, wird viel darüber diskutiert: http://developer.yahoo.net/blog/archives/2007/07/high_performanc_11.html

Ich habe auch diese Antwort auf ServerFault gefunden, die das Thema noch einmal aufgreift: https://serverfault.com/questions/55919/yslow-says-etags-are-misconfigured-how-to-configure-etags-properly-on-iis7

Answer 4

Ja, das ist ein korrektes und wohlbekanntes Verhalten (vielleicht nicht wirklich notwendig).

Lesen Sie http://www.w3.org/Protocols/rfc2616/rfc2616-sec14.html über ETag.

Wahrscheinlich sollten Sie ETag auf dem Server einfach deaktivieren.

Edit: Verwenden Sie auch das Addon LiveHTTPHeaders, um zu verstehen, was Ihr Browser macht. Es funktioniert besser als FireBug für diese Aufgabe.

Answer 5

Ich habe das gleiche Problem wie Sie. Entfernen Sie die etag wird funktionieren.

Fügen Sie Folgendes in die Konfigurationsdatei ein: FileETag keine