MENU

CSS/JSファイルの変更がなかなか反映されないときの対処法

CSSやJSファイルのデータはブラウザのキャッシュ機能によって、常にキャッシュされています。WordPressに変更したファイルをアップロードしても、反映されないことがあるのはこのためです。非常に簡単な方法で解決することができたので紹介します。

クエリパラメーター


<link href="style.css?a=1" rel="stylesheet">
<script src="script.js?a=1"></script>

こんな感じでファイル名の後ろにURLクエリパラメーターを指定します。

PHPなら

キャッシュを有効にしつつ、cssやjsファイルの変更を確実に反映させる

こちらの記事では、ファイルの変更日を取得して、自動的にURLクエリパラメーターを付与するという方法が紹介されていました。


if (file_exists('js/script.js'))
{
  $date = new DateTime();
  $date->setTimestamp(filemtime('js/script.js'));
  
  echo '<script src="js/script.js?a='.$date->format('YmdHis').'"></script>';
}

まあ、毎回キャッシュのせいで古いデータが読み込まれるわけではないようなので、変更されなかったときだけ自分でURLクエリパラメーターを付けてやればいいと思います。