¿Cómo configurar encabezados HTTP (para control de caché)?

238

¿Cómo habilitar el almacenamiento en caché del navegador para mi sitio? ¿Acabo de poner cache-control: public en algún lugar de mi encabezado como este?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
Cache-Control:public;
>

Estoy usando la última versión de PHP que se desarrolla en la última versión de XAMPP.

Andrés
fuente
¿Qué idioma del servidor estás usando? PHP, ASP, JSP? la forma en que configura los encabezados es similar pero no exactamente la misma. O si está CACHING imágenes ... a menudo esto se hace en su Apache (o servidor web) config
scunliffe
Lamentablemente, esa "solución" simplemente genera un DOCTYPE no válido ;-) Si desea hacerlo desde HTML (no lo recomendaría), usaría META HTTP-EQUIV

Respuestas:

198

Para usar el control de caché en HTML, use la metaetiqueta , por ejemplo

<meta http-equiv="Cache-control" content="public">

El valor en el campo de contenido se define como uno de los cuatro valores a continuación.

Parte de la información en el Cache-Controlencabezado es la siguiente

HTTP 1.1. Valores permitidos = PUBLIC | PRIVADO | NO-CACHE | NO TIENDA

Público: puede almacenarse en caché en cachés compartidos públicos.
Privado: solo se puede almacenar en caché en caché privado.
Sin caché: no se puede almacenar en caché.
No-Store: puede almacenarse en caché pero no archivarse.

La directiva CACHE-CONTROL: NO-CACHE indica que la información almacenada en caché no debe usarse y, en cambio, las solicitudes deben enviarse al servidor de origen. Esta directiva tiene la misma semántica que PRAGMA: NO-CACHE.

Los clientes DEBEN incluir PRAGMA: NO-CACHE y CACHE-CONTROL: NO-CACHE cuando se envía una solicitud sin caché a un servidor que no cumple con HTTP / 1.1. Ver también CADUCOS.

Nota: Puede ser mejor especificar los comandos de caché en HTTP que en las declaraciones META, donde pueden influir más que el navegador, pero los proxies y otros intermediarios que pueden almacenar información en caché.

Codemwnci
fuente
30
HTML5 prohíbe esto y <meta>siempre ha sido una forma terrible y escamosa de especificar el almacenamiento en caché.
Kornel
1
@porneL Tengo problemas para comprender qué parte de sus enlaces prohíbe qué parte de la respuesta ... las especificaciones de la metaetiqueta no dicen nada acerca de que no le guste lo que está escrito aquí, ¿o de prohibirlo?
Félix Gagnon-Grenier
1
@ FélixGagnon-Grenier "El atributo http-equiv es un atributo enumerado" significa que solo permite valores en la tabla en la especificación. Incluso llama al almacenamiento en caché en la sección posterior ("otras directivas de pragma"):> Las directivas de pragma correspondientes a los encabezados que afectan el modelo de procesamiento HTTP (por ejemplo, el almacenamiento en caché) no deben registrarse, ya que darían como resultado un comportamiento de nivel HTTP diferente para agentes de usuario que implementan HTML que para agentes de usuario que no lo hacen.
Kornel
3
El documento citado no es correcto con respecto al no-storevalor (a pesar de que el documento hace referencia a RFC 2068 ): no-storeevita que el documento se almacene / guarde en caché en cualquier lugar. Mientras que no-cachesí permite que se almacene, pero debe verificar con el servidor cada vez. Los navegadores tienden a almacenar no-cachepáginas para habilitar la funcionalidad de botón de retroceso , etc.
MrWhite
3
Google proporciona una de las referencias más fáciles para el almacenamiento en caché de HTTP IMO: developers.google.com/web/fundamentals/performance/…
MrWhite
137

Puede configurar los encabezados en PHP utilizando:

<?php
  //set headers to NOT cache a page
  header("Cache-Control: no-cache, must-revalidate"); //HTTP 1.1
  header("Pragma: no-cache"); //HTTP 1.0
  header("Expires: Sat, 26 Jul 1997 05:00:00 GMT"); // Date in the past

  //or, if you DO want a file to cache, use:
  header("Cache-Control: max-age=2592000"); //30days (60sec * 60min * 24hours * 30days)

?>

Tenga en cuenta que los encabezados exactos utilizados dependerán de sus necesidades (y si necesita admitir HTTP 1.0 y / o HTTP 1.1 )

scunliffe
fuente
3
Pragmay Expiresprobablemente sean redundantes para la gran mayoría de los navegadores. fastly.com/blog/headers-we-dont-want
thijsai
1
@thijsai, sí HTTP / 1.0 también está enormemente desactualizado ... use solo los encabezados que necesita según su matriz de usuario
scunliffe
51

Como escribí es mejor usar el archivo .htaccess. Sin embargo, tenga cuidado con el tiempo que deja los contenidos en la memoria caché.

Utilizar:

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

Donde: 604800 = 7 días

PD: Esto se puede usar para restablecer cualquier encabezado

Guillermo
fuente
30

La página en http://www.askapache.com/htaccess/apache-speed-cache-control.html sugiere usar algo como esto:

Agregar encabezados de control de caché

Esto va en su archivo raíz .htaccess pero si tiene acceso a httpd.conf, eso es mejor.

Este código usa la directiva FilesMatch y la directiva Header para agregar encabezados de control de caché a ciertos archivos.

# 480 weeks
<FilesMatch "\.(ico|pdf|flv|jpg|jpeg|png|gif|js|css|swf)$">
Header set Cache-Control "max-age=290304000, public"
</FilesMatch>
kiwi enojado
fuente
3
¿Es importante el orden en esto? "max-age = 290304000, public" O "public, max-age = 290304000" o ambos son igualmente correctos?
Satya Prakash
2
El orden no importa si los valores no son conflictivos (como cachey no-cache). max-agey publicno entren en conflicto, entonces el orden no importa.
Blaise
1
Tenga en cuenta que, dado que utiliza la Headerdirectiva, debe habilitarla mod_headers.
Skippy le Grand Gourou
@Skippy le Grand Gourou, ¿cómo habilito mod_headers?
Sam
@SamuelStratford Leí que difiere en otras distribuciones, pero en Debian puedes usar a2enmodo hacer un enlace simbólico de /etc/apache2/mods-available/headers.loada /etc/apache2/mods-enabled/headers.load.
Skippy le Grand Gourou
21

Esto es lo mejor .htaccessque he usado en mi sitio web real:

<ifModule mod_gzip.c>
mod_gzip_on Yes
mod_gzip_dechunk Yes
mod_gzip_item_include file .(html?|txt|css|js|php|pl)$
mod_gzip_item_include handler ^cgi-script$
mod_gzip_item_include mime ^text/.*
mod_gzip_item_include mime ^application/x-javascript.*
mod_gzip_item_exclude mime ^image/.*
mod_gzip_item_exclude rspheader ^Content-Encoding:.*gzip.*
</ifModule>

##Tweaks##
Header set X-Frame-Options SAMEORIGIN

## EXPIRES CACHING ##
<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>
## EXPIRES CACHING ##

<IfModule mod_headers.c>
    Header set Connection keep-alive
    <filesmatch "\.(ico|flv|gif|swf|eot|woff|otf|ttf|svg)$">
        Header set Cache-Control "max-age=2592000, public"
    </filesmatch>
    <filesmatch "\.(jpg|jpeg|png)$">
        Header set Cache-Control "max-age=1209600, public"
    </filesmatch>
    # css and js should use private for proxy caching https://developers.google.com/speed/docs/best-practices/caching#LeverageProxyCaching
    <filesmatch "\.(css)$">
        Header set Cache-Control "max-age=31536000, private"
    </filesmatch>
    <filesmatch "\.(js)$">
        Header set Cache-Control "max-age=1209600, private"
    </filesmatch>
    <filesMatch "\.(x?html?|php)$">
        Header set Cache-Control "max-age=600, private, must-revalidate"
      </filesMatch>
</IfModule>
Erich García
fuente
3
Ejemplo casi perfecto de un archivo .htaccess ... ¿Estaría completo si se incluyeran imágenes específicas y cómo escribir la ruta a la imagen Y dónde colocar el archivo .htaccess (por ejemplo, en el directorio de imagen o directorio de índice)? .. .p.ej. '<IfModule mod_headers.c> <Archivos /img/myimage.jpg> Encabezado agregar Cache-Control "max-age = 3600, must-revalidate" </Files> </IfModule>' ... ¿funcionaría esto? .. . O ... o pegado en img dir '<filesmatch "^ (example \ .jpg | sample \ .png) $"> Conjunto de encabezado Cache-Control "max-age = 31536000, public" </filesmatch>' .. Una estrategia igual parece arriesgada: de todos modos, ejemplos específicos serían geniales si fuera posible
Marco-UandL
2
solo para su información: la compresión gzip en archivos JS y CSS puede ayudar a romper su encriptación SSL. Si confía en la seguridad, no active gzip
Eduard Void
1
Esto es el almacenamiento en caché de la página de la cuenta de inicio de sesión, por lo que no puede cerrar sesión en su cuenta. Peor aún, alguien no puede acceder a la página de la cuenta e iniciar sesión con el último inicio de sesión de los usuarios. No es recomendable usarlo en un sitio de comercio electrónico, luego debe eliminarlo <filesMatch "\.(x?html?|php)$">para evitar que las páginas HTML estáticas se almacenen en caché. El resto de los emparejamientos de archivos están bien.
nicoX
1
Usted ha duplicado <filesmatch "\.(eot|woff|otf|ttf|svg)$">.
nicoX
2
Establece cssy jsen privado si tiene almacenamiento en caché de proxy. No pude encontrar ninguna recomendación en su enlace con respecto a eso. La mayoría de los CDN recomiendan que almacene en caché esos valores.
nicoX
14

Para el servidor Apache, debe verificar mod_expires para configurar los encabezados Expires y Cache-Control.

Alternativamente, puede usar la directiva Header para agregar Cache-Control por su cuenta:

Header set Cache-Control "max-age=290304000, public"
Peter Štibraný
fuente
5

La etiqueta de control de meta caché permite a los editores web definir cómo las cachés deben manejar las páginas. Incluyen directivas para declarar lo que debe ser almacenable en caché, lo que puede almacenarse mediante cachés, modificaciones del mecanismo de caducidad y controles de revalidación y recarga.

Los valores permitidos son:

Público: puede almacenarse en caché en cachés compartidos públicos
Privado: solo puede almacenarse en caché en caché privado
sin caché: no puede almacenarse en caché
sin almacenamiento: puede almacenarse en caché pero no archivarse

Tenga cuidado con la mayúsculas y minúsculas. Agregue la siguiente metaetiqueta en la fuente de su página web. La diferencia en la ortografía al final de la etiqueta es que usas "/> = xml o"> = html.

    <meta http-equiv="Cache-control" content="public">
    <meta http-equiv="Cache-control" content="private">
    <meta http-equiv="Cache-control" content="no-cache">
    <meta http-equiv="Cache-control" content="no-store">

Fuente-> MetaTags

Karthik NG
fuente
corrección: no-store no debe almacenarse en caché, no se permite almacenar en caché, pero debe verificarse con el servidor antes de ser reservado - consulte palizine.plynt.com/issues/2008Jul/cache-control-attributes
DangerMouse
No-store de Cache-Control: no-store es similar a no-cache en que la respuesta no se puede almacenar en caché y reutilizar, sin embargo, hay una diferencia importante. no-store requiere que el recurso se solicite y descargue del servidor de origen cada vez. Esta es una característica importante cuando se trata de información privada.
MarcoZen
5

OWASP recomienda lo siguiente,

Siempre que sea posible, asegúrese de que el encabezado HTTP de control de caché esté configurado con no-cache, no-store, must-revalidate, private; y que el encabezado HTTP pragma está configurado sin caché.

<IfModule mod_headers.c>
    Header set Cache-Control "private, no-cache, no-store, proxy-revalidate, no-transform"
    Header set Pragma "no-cache"
</IfModule>
Won Jun Bae
fuente