Planteamiento del problema
Cuando se actualiza una aplicación web, de cara al usuario final pueden existir cambios tanto en el html de la página como en los ficheros que la complementan, típicamente css, js e imágenes. Puesto que los navegadores suelen cachear este tipo de ficheros, puede ocurrir lo siguiente:
El usuario Pepito navega tranquilamente por la web A. Su navegador cachea los css, js e imágenes. Poco después, los desarrolladores de la web A deciden realizar una actualización que implica tanto cambios en el html final como cambios en los css, js e imágenes. Pepito vuelve a entrar en la web A y su navegador descarga únicamente el html, tomando el resto de ficheros de su cache. Por lo tanto, no actualiza los css, js ni imágenes. Pepito estaría viendo el html nuevo junto con los css, js e imágenes antiguos. Probablemente esta mezcla de versiones haría que Pepito no visualizara correctamente la web.
Solución al problema
La solución que propongo es cambiar la url con la que se piden los css, js e imágenes de una actualización a otra. Ni siquiera es necesario cambiar el nombre de los ficheros. Basta con añadir un parámetro a la url que cambie con cada actualización.
Por ejemplo, en lugar de pedir los ficheros así:
- <link type=«text/css» rel=«stylesheet» href=«/css/mi_css.css»/>
- <script type=«text/javascript» src=«/js/mi_javascript.js»/>
- <img src=«/img/mi_imagen.gif»/>
habría que solicitarlos de la siguiente manera:
- <link type=«text/css» rel=«stylesheet» href=«/css/mi_css.css?1.0.0»/>
- <script type=«text/javascript» src=«/js/mi_javascript.js?1.0.0»/>
- <img src=«/img/mi_imagen.gif?1.0.0»/>
y tras una actualización, así:
- <link type=«text/css» rel=«stylesheet» href=«/css/mi_css.css?1.1.0»/>
- <script type=«text/javascript» src=«/js/mi_javascript.js?1.1.0»/>
- <img src=«/img/mi_imagen.gif?1.1.0»/>
Como podrás observar, simplemente he añadido un parámetro a las urls. Puedes poner cualquier cosa siempre y cuando cambie entre una actualización y otra. En mi caso se trata de la versión de la aplicación. En el primer caso era la versión 1.0.0 y tras actualizar la aplicación web a la versión 1.1.0, el html quedaría como el último ejemplo.
Fuente: http://www.latascadexela.es/2008/09/evitar-cach-de-los-navegadores-al.html