2010-11-10 15 views
31

Recientemente analicé mi sitio web con el complemento de velocidad de página en firebug. Me sugirió establecer la caducidad en CSS, JS y archivos de imagen.Cómo configuro la caducidad en CSS, JS e Imágenes

Me pregunto cómo puedo hacer esto?

+1

que realmente depende de qué plataformas está utilizando: IIS 6/7, Apache, etc. – jordanbtucker

+0

estoy usando Apache como mi servidor web. Estoy mostrando esos archivos a través de mis archivos php o dentro de los archivos php – KoolKabin

Respuesta

40

Este es el que yo uso para fijar exactamente lo mismo cuando me encontré con el Page Speed ​​Addon:

<FilesMatch "\.(jpg|jpeg|png|gif|swf)$"> 
    Header set Cache-Control "max-age=604800, public" 
</FilesMatch> 

Esto va en su archivo .htaccess.

leer en esta página para obtener más información acerca de cómo configurar la caché para los tipos de archivos adicionales y/o cambiar la longitud de caché:

http://www.askapache.com/htaccess/apache-speed-cache-control.html

+3

Obtuve el error de 500 servidor interno. Creo que mi apache header_module no está habilitado. tengo otra forma? – KoolKabin

+4

¿Recibió un error de 500 y luego acepto la respuesta? –

+0

gracias amigo también funciona para mí, incluso después de 3 años –

0

Lo que hago es crear un archivo "expires.conf "e incluirlo en la configuración del archivo del sitio de Apache. Puede incluir en .htaccess si lo desea. Mi expira:

<IfModule mod_expires.c> 
    ExpiresActive On 
    ExpiresByType image/jpg "access 1 year" 
    ExpiresByType image/jpeg "access 1 year" 
    ExpiresByType image/gif "access 1 year" 
    ExpiresByType image/png "access 1 year" 
    ExpiresByType text/css "access 1 month" 
    ExpiresByType text/html "access 1 month" 
    ExpiresByType application/pdf "access 1 month" 
    ExpiresByType text/x-javascript "access 1 month" 
    ExpiresByType application/x-shockwave-flash "access 1 month" 
    ExpiresByType image/x-icon "access 1 year" 
    ExpiresDefault "access 1 month" 
</IfModule> 

debes activar el módulo expira en Apache.

-2

mejor uno (que se encuentra en http://www.paulund.co.uk/set-expire-headers-in-htaccess, sino como 0 seconds no funcionó, he cambiado a 1 seconds)

# These are pretty far-future expires headers 
# They assume you control versioning with cachebusting query params like: <script src="application.js?20100608"> 
# Additionally, consider that outdated proxies may miscache 
# 
# www.stevesouders.com/blog/2008/08/23/revving-filenames-dont-use-querystring/ 
# If you don`t use filenames to version, lower the css and js to something like "access plus 1 week" 

<IfModule mod_expires.c> 
    ExpiresActive on 

# Perhaps better to whitelist expires rules? Perhaps. 
    ExpiresDefault       "access plus 1 month" 

# cache.appcache needs re-requests in FF 3.6 (thx Remy ~Introducing HTML5) 
    ExpiresByType text/cache-manifest  "access plus 1 seconds" 


# Your document html 
    ExpiresByType text/html     "access plus 1 seconds" 

# Data 
    ExpiresByType text/xml     "access plus 1 seconds" 
    ExpiresByType application/xml   "access plus 1 seconds" 
    ExpiresByType application/json   "access plus 1 seconds" 

# RSS feed 
    ExpiresByType application/rss+xml  "access plus 1 hour" 

# Favicon (cannot be renamed) 
    ExpiresByType image/x-icon    "access plus 1 week" 

# Media: images, video, audio 
    ExpiresByType image/gif     "access plus 1 month" 
    ExpiresByType image/png     "access plus 1 month" 
    ExpiresByType image/jpg     "access plus 1 month" 
    ExpiresByType image/jpeg    "access plus 1 month" 
    ExpiresByType video/ogg     "access plus 1 month" 
    ExpiresByType audio/ogg     "access plus 1 month" 
    ExpiresByType video/mp4     "access plus 1 month" 
    ExpiresByType video/webm    "access plus 1 month" 

# HTC files (css3pie) 
    ExpiresByType text/x-component   "access plus 1 month" 

# Webfonts 
    ExpiresByType font/truetype    "access plus 1 month" 
    ExpiresByType font/opentype    "access plus 1 month" 
    ExpiresByType application/x-font-woff "access plus 1 month" 
    ExpiresByType image/svg+xml    "access plus 1 month" 
    ExpiresByType application/vnd.ms-fontobject "access plus 1 month" 

# CSS and JavaScript 
    ExpiresByType text/css     "access plus 1 seconds" 
    ExpiresByType application/javascript "access plus 1 month" 
    ExpiresByType text/javascript   "access plus 1 month" 

    <IfModule mod_headers.c> 
    Header append Cache-Control "public" 
    </IfModule> 

</IfModule> 
5

me gustaría añadir esta solución para aquellos en busca de ella .. ..

su también funciona muy bien ... usando .htaccess

https://webmasters.stackexchange.com/a/5275/37765

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

Muchas gracias dan esta solución ..... –

+0

Me funcionó. Sin embargo, quiero saber qué sucede si un sitio se rompe después de agregar este código. – Rahul

Cuestiones relacionadas