Jak ustawić nagłówki wygasania dla CSS, JS i obrazów?

38

Niedawno przeanalizowałem moją stronę przy pomocy dodatku pagepeed w Firebug. Zasugerowało mi ustawienie wygasania dla CSS, JS i plików obrazów.

Zastanawiam się, jak to zrobić?

— KoolKabin
źródło

37

Zaktualizuj konfigurację Apache, aby uwzględnić poniższe dyrektywy jako część podstawowej konfiguracji :

# 
# associate .js with "text/javascript" type (if not present in mime.conf)
# 
AddType text/javascript .js

# 
# configure mod_expires
# 
# URL: http://httpd.apache.org/docs/2.2/mod/mod_expires.html
# 
<IfModule mod_expires.c>
    ExpiresActive On
    ExpiresDefault "access plus 1 seconds"
    ExpiresByType image/x-icon "access plus 2692000 seconds"
    ExpiresByType image/jpeg "access plus 2692000 seconds"
    ExpiresByType image/png "access plus 2692000 seconds"
    ExpiresByType image/gif "access plus 2692000 seconds"
    ExpiresByType application/x-shockwave-flash "access plus 2692000 seconds"
    ExpiresByType text/css "access plus 2692000 seconds"
    ExpiresByType text/javascript "access plus 2692000 seconds"
    ExpiresByType application/x-javascript "access plus 2692000 seconds"
    ExpiresByType text/html "access plus 600 seconds"
    ExpiresByType application/xhtml+xml "access plus 600 seconds"
</IfModule>

# 
# configure mod_headers
# 
# URL: http://httpd.apache.org/docs/2.2/mod/mod_headers.html
# 
<IfModule mod_headers.c>
    <FilesMatch "\\.(ico|jpe?g|png|gif|swf|css|js)$">
        Header set Cache-Control "max-age=2692000, public"
    </FilesMatch>
    <FilesMatch "\\.(x?html?|php)$">
        Header set Cache-Control "max-age=600, private, must-revalidate"
    </FilesMatch>
    Header unset ETag
    Header unset Last-Modified
</IfModule>

— John Conde
źródło

Dostaję błąd 500 serwera wewnętrznego, gdy umieszczam go w pliku .htaccess

— KoolKabin,

Twoja konfiguracja Apache może nie obsługiwać wszystkich powyższych opcji. Zaktualizuję tę odpowiedź wkrótce, aby pomóc rozwiązać ten problem.

— John Conde

Mój Drupal zawiera odwołania do javascript / css, takie jak: www.example.com/misc/jquery.js?v=1.4.4 lub www.example.com/sites/all/modules/nice_menus/css/nice_menus.css?mtu293 wydaje się nie działać dla takich plików. Czy jest aktualizowany na dzisiaj?

— AgA

2

@JohnConde Dlaczego wygasa i nagłówki? Ponadto, czy na przykład podczas aktualizacji obrazu lub css należy zmienić nazwę pliku? Lub w przypadku pliku css wersja działa: test.css? 123?

— powstanie przeciw

14

Możesz umieścić to w swoim htaccess:

<FilesMatch "(?i)^.*\.(ico|flv|jpg|jpeg|png|gif|js|css)$">
ExpiresActive On
ExpiresDefault A2592000
</FilesMatch>

Będzie celował w pliki z tymi rozszerzeniami (ico, flv, jpg itd.) I ustawi nagłówek Expires na czas dostępu (A) plus 30 dni (2592000 sekund). Możesz również dodać to na poziomie serwera, jeśli masz do tego dostęp.

— DisgruntledGoat
źródło

2

Zależy to od hosta i sposobu serwera tych rzeczy. Opcja 1) jeśli kontrolujesz serwer, zrób apache, aby dodać nagłówki wygasające w odpowiedzi Opcja 2) jeśli nie kontrolujesz serwera WWW lub serwujesz obrazy / js / css / etc, możesz ustawić te nagłówki ze skryptu, który serweruj je

Pamiętaj, że te wskazówki są godne polecenia, ale nie są absolutną prawdą. Są one bardziej w celu zaoszczędzenia przepustowości niż przyspieszenia Twojej witryny. Więc jeśli masz mały ruch na swojej stronie, nie martw się zbytnio o to.

— Ilian Iliev
źródło

Jestem z opcją 2. Jak ustawić te nagłówki ze skryptu. Skrypt oznacza php lub który?

— KoolKabin

Możesz sprawdzić stackoverflow.com/questions/2185449/... jest to przykład python, ale jeśli znasz programowanie, myślę, że zrozumiesz. W php będziesz musiał użyć nagłówków (). Należy jednak pamiętać, że w tym przypadku wszystkie pliki „statyczne” będą musiały być obsługiwane przez skrypt, co zwiększy przydział procesora. Teraz przychodzi mi do głowy, że jest trzecia opcja. Użyj CDN dla tych plików.

— Ilian Iliev,

2

Konfiguracja wygasa w Lightspeed Web Server

Zaloguj się do konsoli administracyjnej, a następnie> Serwer-> Ogólne-> Wygasa Ustawienia-> Wygasa według typu

Dodaj następujące:

text/css=A604800, text/javascript=A604800, application/javascript=A604800, application/x-javascript=A604800, application/x-shockwave-flash=A604800, image/gif=A604800, image/jpg=A604800, image/jpeg=A604800, image/png=A604800, image/ico=A604800, image/icon=A604800

604800 to sekundy wygaśnięcia, które powinny być dostosowane do twoich potrzeb, ponieważ jego 168 godzin, czyli 7 dni. Dodatkowo Light Speed Server korzysta z htaccess, który musisz dodać następujący wiersz:

ExpiresActive On

Alternatywnie, jeśli nie masz dostępu do konsoli administratora, wypróbuj następujący plik .htaccess:

  ExpiresByType image/png A604800
  ExpiresByType image/gif A604800
  ExpiresByType image/jpg A604800
  ExpiresByType image/jpeg A604800
  ExpiresByType text/javascript A604800
  ExpiresByType application/x-javascript A604800
  ExpiresByType text/css A604800

— Simon Hayter
źródło