Evita la caché mientras desarrollas

Publicado por fpuente el 7 Mar, 2016

Resulta bastante incómodo en entornos de desarrollo que tanto los ficheros Javascript como los de estilos se queden cacheados ya que la URL no cambia, sobre todo si estamos trabajando sobre temas hijo que sobreescriben estilos o funciones.

Como bien sabemos, desde hace unas cuantas versiones, WordPress incorpora a la URL de nuestros scripts un parámetro ver que indica la versión de WP que estamos utilizando.

La solución es bastante sencilla y pasa por modificar las URL que ha generado WordPress en las llamadas que utilizamos métodos wp_enqueue_style y wp_enqueue_script, consiguiendo que el navegador crea que es un nuevo archivo a descargar.

Para realizar esta modificación sólo tenemos que añadir las siguientes líneas a nuestro fichero functions.

// Eliminar la versión de WP de la url
function remove_src_version ( $url ) {
//Regex quitar el parametro ver
$url = preg_replace('/([?&])' . 'ver' . '=[^&]+(&|$)/','$1',$url);
//Eliminar caracteres erroneos al final
if (preg_match("/\?$/", $url) || preg_match("/\&$/", $url))
return substr($url, 0, -1);
else
return $url;
}
// Añadir un parametro Random a la url
function add_src_param ( $url ) {
$url = remove_src_version($url);
$parsed_url = parse_url($url);
if(isset($parsed_url['query']))
return $url . '&__rtime=' . time();
else
return $url . '?__rtime=' . time();
}
add_filter( 'script_loader_src', 'add_src_param' );
add_filter( 'style_loader_src', 'add_src_param' );

// Eliminar la versión de WP de la url

function remove_src_version ( $url ) {

//Regex quitar el parametro ver

$url = preg_replace('/([?&])' . 'ver' . '=[^&]+(&|$)/','$1',$url);

//Eliminar caracteres erroneos al final

if (preg_match("/\?$/", $url) || preg_match("/\&$/", $url))

return substr($url, 0, -1);

else

return $url;

}

// Añadir un parametro Random a la url

function add_src_param ( $url ) {

$url = remove_src_version($url);

$parsed_url = parse_url($url);

if(isset($parsed_url['query']))

return $url . '&__rtime=' . time();

else

return $url . '?__rtime=' . time();

}

add_filter( 'script_loader_src', 'add_src_param' );

add_filter( 'style_loader_src', 'add_src_param' );

Básicamente lo que hacemos es añadir dos Hooks para modificar todas las cargas de scripts y styles que realice WordPress y modificar el parámetro URL en dos pasos: quitamos el parámetro ver y añadimos un parámetro dinámico a la misma.

Y recordar, una vez finalizado el desarrollo, eliminar estos filtros de vuestro functions.php del tema activo.

Nota: a veces no solo el navegador está cacheando los archivos, es posible que exista una CDN intermedia o alguna cabecera a nivel de servidor que también fuerce el cacheo de dichos archivos.

AVISO: esta publicación es de hace dos años o más. Si es un código o un plugin podría no funcionar en las últimas versiones de WordPress, y si es una noticia podría estar ya obsoleta. Luego no digas que no te hemos avisado.