Evitar el cache de los css y js

Agregar a favoritos

14 Comentarios

Posteado hace 615 días en:

Muchas veces nos ha pasado que hacemos cambios en las hojas de estilos pero no se ven reflejados o se ven a medias y te hacen una especie de mezcla de lo antiguo y lo nuevo. Para evitarlo hay una forma muy sencilla y es el poner la fecha de modificación del archivo como variable, con esto consigues que el navegador fuerce el cache solo cuando ha sido modificado.

function version($file) {
    return $file.'?'.filemtime($file);
}

<link href="<?php echo version('css.css'); ?>" rel="stylesheet" type="text/css" />

  • avatar

    noth#1 hace 615 días

    MMM, parece interesante, pero me aborda una duda, parecerá una tontería pero el tener que llamar a una función para devolvernos un fichero, nos supone un gasto de servidor, por cada página vista, a niveles de páginas con muchas visitas como crees que podrá afectar, vamos yo lo veo genial para desarrollo pero para producción ...


  • avatar

    Abraham Estrada#2 hace 615 días

    Lo que yo uso es:


  • avatar

    Abraham Estrada#3 hace 615 días

    < link href = "estilo.css?" rel = "stylesheet" type="text/css" / >


  • avatar

    DrSlump#4 hace 615 días

    Yo utilizo una variable con la revisión de SVN en producción y un random en desarrollo/preproducción.

    Algo así:

    $REV = /#REV#/ rand();

    Cuando se despliega en producción se ejecuta un pequeño script que modifica "/#REV#/" por "[revision];//" siendo [revision] el número de revisión de subversion del código desplegado.

    Para llamar a un fichero css/js/imagen simplemente se le pone la variable detrás:

    href="site.css?rev="

    Realmente es muy parecido a lo que expones, pero filemtime() es mucho más lento que usar un random o algo precalculado. Además de ahorrase el cambio de contexto al llamar una función.


  • avatar

    Abraham Estrada#5 hace 615 días

    < link href = "estilo.css?< ?php echo time(); ? >" rel = "stylesheet" type="text/css" / >

    Perdon por los comentarios extras, pero esta es la linea que uso, solo time() y un ? despues de la extension .css


  • avatar

    Jack#6 hace 615 días

    Sin necesidad de hacerlo para cada archivo, se podria utilizar

    header("Expires: Mon, 26 Jul 1997 05:00:00 GMT"); header('Last-Modified: '.gmdate('D, d M Y H:i:s') . ' GMT');


  • avatar

    DrSlump#7 hace 615 días

    @jack

    Un problema que me he encontrado con las cabeceras de control de cache es que a veces algunas versiones de navegadores no les hacen caso. Además de que muchos proxies no las siguen y dependiendo de la topología de la red puede dar más de un dolor de cabeza.


  • avatar

    Jack#8 hace 615 días

    @DrSlump

    Bueno, ahora siguiendo cada navegador los estandares todos deberian de funcionar igual sin haber diferencias. Para eso fueron pensadas ese tipo de cabeceras.

    En todo caso si desearia utilizar la funcion de icebeat, se podria hacer:


  • avatar

    acido79#9 hace 615 días

    No es por nada; pero no usáis: Ctrl+F5

    yo llevo 4 meses solo maquetando; y nunca he tenido problema de cache con la CSS refrescando Ctrl+F5.

    O hay alguna información que me he perdido?


  • avatar

    DrSlump#10 hace 615 días

    @Jack

    Los navegadores han avanzado mucho en el manejo de standares. Ahora ya casi todos soportan realmente bien los expires, last-modified y los etags.

    Sin embargo imagine que el cliente que le ha encargado un sitio web está detrás del anticuado y restrictivo proxy de su empresa, que tiene unos parámetros muy agresivos heredados de una época donde el ancho de banda era un bien muy preciado. Cuando le llama para decirle que ha desplegado una nueva versión de la web, él accede y al seguir viendo lo antiguo le llama indignado pidiendo explicaciones.

    Parece ciencia ficción pero por desgracia no lo es.


  • avatar

    IceBeat#11 hace 614 días

    Que de comentarios :).

    Veo que cuando escriben código tienen problemas, decirme que ocurre para poderlo solucionar, usáis bien Markdown? para escribir código hay que tabularlo.

    @noth creo que he llegado tarde y ya te han contestado.

    @Abraham Estrada yo no usaría time porque fuerza siempre el cache y eso tampoco es bueno.

    @acido79 para maquetar nosotros no tenemos problemas en forzarlo pero para los demás es posible que no se vean los cambios

    @DrSlump muchas gracias por el aporte, una vez más, creo que te voy hacer coautor de esta bitácora jeje porque me ayudas un montón. A ver si mis compañeros pueden hacer ese apaño en el SVN, aunque bueno con tu idea fuerzas a cambiar todos los archivos, en mi caso solo el que ha sido modificado.

    @Jack nunca me han gustado las cabeceras, no se porque pero muchas veces hacen lo que quieren.


  • avatar

    David Martínez#12 hace 608 días

    Dani, puede que te sirva Subversion Keywords ;)


  • avatar

    David Martínez#13 hace 608 días

    Oooops, el enlace: http://dmnet.bitacoras.com/archivos/programacion/subversion-keywords.php


  • avatar

    Icebeat#14 hace 607 días

    @David Martínez muchas gracias compañero, que haríamos nosotros sin ti :).