Detener el almacenamiento en caché de Chrome de mis archivos JS

6 minutos de lectura

Haré un cambio en mis archivos JS, pero en realidad no cambiará en el navegador, tengo que cambiar el nombre de los archivos cada vez para que se vuelva a cargar. ¿Hay algún tipo de comando .htaccess que pueda agregar o algo para que deje de almacenar en caché?

Incluso está almacenando en caché mis páginas html. Necesito reabrir todo mi navegador solo para ver los cambios. ¿Podría ser un problema del servidor?

  • ¿Habilitar el encabezado ETag en su servidor web hace que Chrome almacene en caché pero recupere correctamente una nueva copia del archivo cuando haya cambiado?

    – Desarrollador Webs

    9 de marzo de 2018 a las 16:01

avatar de usuario
MartinHN

Puede hacer clic en el icono de configuración en la esquina superior derecha ... | Más herramientas | Herramientas de desarrollo | La red | Desactivar el caché (mientras DevTools está abierto)

Para Windows, esto es F12 o CTRL + MAYÚS + I mientras está en mac CMD + MAYÚS + I abre DevTools.

Nueva ruta para la actualización de Chrome de septiembre de 2018:

Haga clic en el icono de configuración en la esquina superior derecha ... | Ajustes | preferencias | Herramientas de desarrollo | La red | Desactivar el caché (mientras DevTools está abierto)

  • Gran falla de Chrome para almacenar cosas en caché… incluso cuando la página está marcada con Sin caché… Oh, bueno, al menos esto funciona, los usuarios pueden sufrir, pero al menos puedo desarrollar

    – Robert Noack

    21 de junio de 2014 a las 15:35

  • ¡Tenga en cuenta que la “Configuración” ya no se encuentra en la parte inferior derecha! Haga clic en el menú de tres puntos en el parte superior derecha para llegar a la configuración.

    – yizzlez

    14/07/2016 a las 18:35

  • La ubicación es: esquina superior derecha | “…” | ajustes | Preferencias | Red | “Desactivar caché (mientras DevTools está abierto).

    – átomo88

    28/11/2016 a las 18:00

  • ¡¡¡Esto es MUY MALA PRÁCTICA!!! No, no debe tener un truco temporal para su uso… debe tener una solución PERMANENTE para TODOS sus usuarios. La mejor manera es una cadena de consulta aleatoria al final de src. src=”someJs.js?someRandomStringCreatedByInlineJsOrServerRenderedCode” lo que haría que tuviera una versión nueva cada vez. una buena cadena aleatoria sería tomar la fecha/hora de hoy y colocarla allí. es posible que deba convertirlo en una cadena, ya que probablemente sea un objeto de fecha. Es realmente muy malo que esta fuera la respuesta elegida y votada tan fuertemente.

    usuario1816910

    19 de julio de 2017 a las 15:25

  • A partir de Chrome 61.0.3163.100, parece que la opción ahora se encuentra en Más herramientas/Condiciones de red. La opción “Herramientas para desarrolladores” ya no existe.

    – justian17

    17 oct 2017 a las 13:44

avatar de usuario
nicole rios

Una forma más rápida de hacer esto es haciendo clic con el botón derecho en el icono de actualización junto a la barra de direcciones y seleccionando Caché vacío y recarga dura

Solo asegúrate de que las herramientas de desarrollo de Chrome estén abiertas. (Presiona F12) Por cierto… Este truco solo funciona en Chrome para Windows, Ubuntu y Mac OS

  • Para su información, probé todo esto, y absolutamente nada funcionó. En mi máquina (con la configuración predeterminada para Mountain Lion), F12 muestra el tablero.

    –Aubrey Goodman

    5 de junio de 2013 a las 20:41

  • ¿Cómo es mucho mejor que la respuesta aceptada? Puede recargar normalmente con la respuesta aceptada.

    – SSH Esto

    14 de junio de 2013 a las 16:21

  • no, no puedes al menos yo no puedo. ninguna de las respuestas funcionó para mí, todavía aparece una alerta que se elimina en mi archivo js local pero todavía está en el archivo js en caché en Chrome.

    – Burak Karakuş

    28 de diciembre de 2015 a las 9:11

  • Funciona para mi. Asegúrese de que las herramientas de desarrollo estén abiertas, de lo contrario, el clic derecho no mostrará el menú.

    – Venryx

    27/04/2017 a las 21:30

  • Veo la opción, pero en mi caso, el script no se actualizó.

    – justian17

    17 oct 2017 a las 13:44

avatar de usuario
EstilosCrisis

Mantener Cambio mientras hace clic en el botón de recarga (F5).

Esto obliga al navegador web a pasar por alto la contenido en caché y tirar de un nueva copia de la página web en el navegador. Cambio + F5 garantiza que el más reciente se cargará el contenido del sitio web. Sin embargo, dependiendo del tamaño de la página, por lo general es Más lento que solo F5.

añadir algo como script.js?a=[random Number] con el número aleatorio generado por PHP.

¿Has probado expire=0, el pragma “no-cache” y “cache-control=NO-CACHE”? (No sé qué dicen de los Scripts).

Algunas ideas:

  1. Cuando actualice su página en Chrome, haga CTRL+F5 para realizar una actualización completa.
  2. Incluso si establece la caducidad en 0, aún se almacenará en caché durante la sesión. Tendrás que cerrar y volver a abrir tu navegador nuevamente.
  3. Asegúrese de que cuando guarde los archivos en el servidor, las marcas de tiempo se actualicen. Chrome primero emitirá un HEAD comando en lugar de un GET completo para ver si necesita descargar el archivo completo nuevamente, y el servidor usa la marca de tiempo para ver.

Si desea deshabilitar el almacenamiento en caché en su servidor, puede hacer algo como:

Header set Expires "Thu, 19 Nov 1981 08:52:00 GM"
Header set Cache-Control "no-store, no-cache, must-revalidate, post-check=0, pre-check=0"
Header set Pragma "no-cache"

En .htaccess

  • Tenía esto, pero la verificación previa = 0, la verificación posterior = 0 es la adición que marcó la diferencia para mí.

    – TadLewis

    30 de enero de 2019 a las 20:05


avatar de usuario
PilaG

Pasos rápidos:

1) Abra el panel de Herramientas para desarrolladores yendo al Menú de Chrome -> Herramientas -> Herramientas para desarrolladores

2) Haga clic en el ícono de configuración en el lado derecho (¡es un engranaje!)

3) Marque la casilla “Deshabilitar caché (cuando DevTools está abierto)”

4) Ahora, mientras el tablero está activo, simplemente presione actualizar y JS no se almacenará en caché.

  • Tenía esto, pero la verificación previa = 0, la verificación posterior = 0 es la adición que marcó la diferencia para mí.

    – TadLewis

    30 de enero de 2019 a las 20:05


El problema es que Chrome necesita tener must-revalidate en el encabezado Cache-Control` para volver a verificar los archivos para ver si es necesario recuperarlos.

Siempre puede presionar SHIFT-F5 y forzar la actualización de Chrome, pero si desea solucionar este problema en el servidor, incluya este encabezado de respuesta:

Cache-Control: must-revalidate

Esto le dice a Chrome que verifique con el servidor y vea si hay un archivo más nuevo. SI hay un archivo más nuevo, lo recibirá en la respuesta. Si no, recibirá una respuesta 304 y la seguridad de que el que está en el caché está actualizado.

Si NO establece este encabezado, en ausencia de cualquier otra configuración que invalide el archivo, Chrome lo nunca verifique con el servidor para ver si hay una versión más nueva.

Aquí hay un entrada en el blog que discute el tema más a fondo.

  • Creo que debería ser Cache-Control: must-revalidate en vez de Cache-Control: must-validate. No creo que esto último sea válido.

    – László Monda

    25 de agosto de 2018 a las 0:03


¿Ha sido útil esta solución?