通过文件时间来强置浏览器更新JS或CSS文件 (WP 技巧)

WORDPRESS 博客的HTML的标签 header 里你经常可以看到 JS或者CSS文件里的引用后面加上一个版本号. 例如:

https://justyy.com/wp-content/themes/twentytwelve/style.css?ver=4.4.2

这URL最后面加上的这个参数是当前 WORDPRESS的版本号. 用意是这样每次更新 WP 版本的时候浏览器就会强制更新这些文件. 因为有的浏览器只要访问URL没变就认为内容没变(当然还受限于其它缓存时间控制).

很经常我在子主题里改 style.css 每次都得强制刷新缓存 (浏览器和CLOUDFLARE). 不是很方便. 如果改成用文件时间来做缓存就会好多了:

把下面的代码加入子主题的 functions.php 里即可.

function justyy_remove_cssjs_ver( $src ) {
  $newsrc = $src;
  if( strpos( $newsrc, '?ver=' ) ) {
    $newsrc = remove_query_arg( 'ver', $newsrc );
  }
  $rootdir = '/var/www'; // 博客在你主机上的地址.
  $url = parse_url($newsrc, PHP_URL_PATH);
  $source = $rootdir .'/'. $url;
  if (is_file($source)) {
    $newsrc .= "?m=".filemtime($source);
    return $newsrc;
  }     
  return $src; // 如果文件不存在 就不管那么多了.
}
add_filter( 'style_loader_src', 'justyy_remove_cssjs_ver', 10, 2 );
add_filter( 'script_loader_src', 'justyy_remove_cssjs_ver', 10, 2 );

function justyy_remove_cssjs_ver( $src ) {
  $newsrc = $src;
  if( strpos( $newsrc, '?ver=' ) ) {
    $newsrc = remove_query_arg( 'ver', $newsrc );
  }
  $rootdir = '/var/www'; // 博客在你主机上的地址.
  $url = parse_url($newsrc, PHP_URL_PATH);
  $source = $rootdir .'/'. $url;
  if (is_file($source)) {
    $newsrc .= "?m=".filemtime($source);
    return $newsrc;
  }     
  return $src; // 如果文件不存在 就不管那么多了.
}
add_filter( 'style_loader_src', 'justyy_remove_cssjs_ver', 10, 2 );
add_filter( 'script_loader_src', 'justyy_remove_cssjs_ver', 10, 2 );

您也可以使用 md5 来做为判断是否更新的标准. 当然这样的话会比较慢因为需要获取文件的内容来计算MD5哈希值.

英文: How to Tell Browsers Re-update CSS/JS files when Files are Changed in WordPress?

GD Star Rating
loading...

本文一共 245 个汉字, 你数一下对不对.

通过文件时间来强置浏览器更新JS或CSS文件 (WP 技巧). (AMP 移动加速版本)
上一篇: 从英国皇家邮政寄包裹到澳大利亚需要多少时间?
下一篇: 想英国代购的有福了: 畅购英伦上线了!

赞赏我的几个理由.

¥ 打赏支持

扫描二维码，分享本文到微信朋友圈