.htaccess - navegadores - htaccess: cómo forzar al navegador del cliente a borrar el caché?

forzar cache html

Question

Para mi sitio tengo las siguientes reglas de htaccess:

# BEGIN Gzip
<IfModule mod_deflate.c>
AddOutputFilterByType DEFLATE text/text text/html text/plain text/xml text/css application/x-javascript application/javascript
</IfModule>
# END Gzip
# BEGIN EXPIRES
<IfModule mod_expires.c>
ExpiresActive On
ExpiresDefault "access plus 10 days"
ExpiresByType text/css "access plus 1 month"
ExpiresByType text/plain "access plus 1 month"
ExpiresByType image/gif "access plus 1 month"
ExpiresByType image/png "access plus 1 month"
ExpiresByType image/jpeg "access plus 1 month"
ExpiresByType application/x-javascript "access plus 1 month"
ExpiresByType application/javascript "access plus 1 month"
ExpiresByType application/x-icon "access plus 1 year"
</IfModule>
# END EXPIRES

Acabo de actualizar mi sitio y parecía todo complicado hasta que borré mi caché. ¿Cómo puedo forzar que el navegador del cliente borre la memoria caché después de una actualización para que el usuario pueda ver los cambios?

Answer 1

Ahora, lo siguiente no lo ayudará con los archivos que ya están en la memoria caché, pero en el futuro, puede usar lo siguiente para forzar fácilmente una solicitud para obtener algo nuevo, sin cambiar el nombre real del archivo.

# Rewrite all requests for JS and CSS files to files of the same name, without
# any numbers in them. This lets the JS and CSS be force out of cache easily
# by putting a number at the end of the filename
# e.g. a request for static/js/site-52.js will get the file static/js/site.js instead.
<IfModule mod_rewrite.c>
RewriteEngine on
RewriteRule ^static/(js|css)/([a-z]+)-([0-9]+)/.(js|css)$ /site/$1/$2.$4 [R=302,NC,L]
</IfModule>

Por supuesto, mientras más arriba en la estructura de su carpeta haga este tipo de acercamiento, más podrá sacar cosas de la caché con un simple cambio.

Entonces, por ejemplo, si almacena el css completo y el javascript de su sitio en una carpeta principal

/assets/js
/assets/css
/assets/...

Entonces puede comenzar a hacer referencia a él como "assets-XXX" en su html, y usar una regla como esta para sacar de la memoria caché todo el contenido de activos.

<IfModule mod_rewrite.c>
RewriteEngine on
RewriteRule ^assets-([a-z0-9]+)/(.*) /$2 [R=302,NC,L]
</IfModule>

Tenga en cuenta que si va con esto, después de que esté funcionando, cambie el 302 a un 301, y luego el almacenamiento en caché se activará. Cuando es un 302 no cacheará en el nivel del navegador porque es una redirección temporal. Si lo hace de esta manera, puede aumentar el tiempo predeterminado de caducidad a 30 días para todos los activos, ya que puede fácilmente sacar cosas de la caché simplemente cambiando el nombre de la carpeta en la página de inicio de sesión.

<IfModule mod_expires.c>
ExpiresActive on
ExpiresDefault A2592000
</IfModule>

Answer 2

Cambia el nombre del archivo .CSS Carga la página y luego vuelve a cambiar el archivo con el nombre original para el que funciona.

Answer 3

Como han dicho otras respuestas, cambiar la URL es una buena técnica de eliminación de memoria caché, sin embargo, es mucho trabajo ir a través de un sitio más grande, cambiar todas las URL y también mover los archivos.

Una técnica similar es simplemente agregar un parámetro de versión a la cadena de URL que sea una cadena / número aleatorio o un número de versión, y orientar solo los archivos modificados.

Por ejemplo, si cambias el CSS de tus sitios y parece poco sólido hasta que realices una actualización forzosa, simplemente agrega ?ver=1.1 a la importación de CSS en la cabecera del archivo. Esto para el navegador es un archivo diferente, pero solo necesita cambiar la importación, no la ubicación real o el nombre del archivo.

p.ej:

<link href="assets/css/style.css" rel="stylesheet" type="text/css" />

se convierte

<link href="assets/css/style.css?ver=1.1" rel="stylesheet" type="text/css" />

Funciona muy bien para los archivos javascript también.

Answer 4

En mi caso, cambio mucho un archivo JS específico y necesito que esté en su última versión en todos los navegadores donde se usa.

No tengo un número de versión específico para este archivo, así que simplemente hash la fecha y hora actual (hora y minuto) y la paso como número de versión:

<script src="/js/panel/app.js?v={{ substr(md5(date("Y-m-d_Hi")),10,18) }}"></script>

Necesito que se cargue cada minuto, pero puede decidir cuándo se debe volver a cargar.

Answer 5

Lo más sencillo es agregar el tiempo de archivo a la solicitud. p.ej

myfile.txt? 2014-10-30-13: 12: 33

versionado por fecha.

Answer 6

No puede obligar a los navegadores a borrar el caché.

Parece que su archivo .html se vuelve a cargar antes, ya que caduca después de 10 días. Lo que tienes que hacer es actualizar tu archivo .html y mover todos tus archivos a una nueva carpeta, como la version-2/ o anexar un identificador de versión a cada archivo, como mypicture-2.jpg . Luego, hace referencia a estos nuevos archivos en su archivo .html y el navegador los cargará nuevamente porque la ubicación cambió.

Answer 7

Puede configurar "acceso más 1 segundo" y de esa manera se actualizará la próxima vez que el usuario ingrese al sitio. Mantenga la configuración por un mes.

Answer 8

Puede decirle al navegador que nunca coloque en caché su sitio pegando el siguiente código en el encabezado

<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Expires" content="0" />

Y para evitar js, css cache, puede usar la herramienta para minificar y ofuscar los scripts que deberían generar un nombre de archivo aleatorio en todo momento. Eso obligaría al navegador a recargarlos también desde el servidor.

Con suerte, eso ayuda.

Answer 9

Puede obligar a los navegadores a almacenar en caché algo, pero

No puede obligar a los navegadores a borrar su caché.

Por lo tanto, la única forma (AMAIK) es usar una nueva URL para sus recursos. Algo como control de versiones.

Answer 10

Tengo tu problema ...

Aunque podemos borrar completamente el caché del navegador del cliente, puede agregar código a su aplicación para que sus cambios recientes se reflejen en el navegador del cliente.

En tu <head> :

<meta http-equiv="Cache-Control" content="no-cache" />
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Expires" content="0" />

Fuente: http://goo.gl/JojsO