キャッシュをクリアせずにcssやjsファイルの変更を反映させる

とあるシステムのWEB画面を改修していたときのこと。

 

使っていたのはjavaのeclipseで、既存システムのjsファイルに新規システムの内容を追記して反映させようとした。

 

ところがどっこい、いざWEB画面を更新してみてもなんにも変化がない、反映されていない。

 

eclipseでソースをクリーンしてみたりしてみたものの、やはり変化がない。

 

これはなんだろう、見てるjsファイルはこいつじゃないのか?などと、んーんー唸って時間が過ぎていた。

 

まぁ、一人で唸っていても埒が明かないので人に聞いてみたところ、更新前のキャッシュが残っていてそのキャッシュを利用しているから変更が反映されていない、ということだった。

 

と言うことでひとまずの解決案として、ブラウザのキャッシュをクリアすることに。

 

それによってめでたくjsファイルの変更は反映されましたとさ、終わり!!

 

ってタイトル回収できてないよ!!

 

ブラウザのキャッシュをクリアしたら、変更したjsファイルが反映される。

 

でもいちいちそんなことしてたら面倒くさいよね、キャッシュを有効にしつつも変更したファイルを反映させる方法があるらしいよ!

やったことないけどね!!

 

と、私に教えてくれた人は言いました。

 

なるほど、これは調べてみるしかあるまいて。

 


本題の前に

そもそもキャッシュってなんだっけ?

 

こういう調べものをするたびに、ところどころに「これなんだっけ?」っていうのがある。

 

今回で言うと、キャッシュ。なんとなーくわかるんだけど、どういうものだっけ?ってなる。

 

以下、キャッシュに対する自分的解釈。

 

キャッシュとは、データへのアクセスを速くするために記憶領域にデータを一時的に保存しておくもの。

 

つまり、よく使うデータなどをキャッシュに保存しておくことでアクセスしたときに、

新たにデータを作成してという順序が必要なくなるので、その分だけ処理を速くすることができる。

 

今回の場合は、変更する前のjsファイルデータがキャッシュに保存されていて、

そのデータを使用して処理を行っていたために、変更したjsファイルデータが反映されていない状態となっていた。

 

つまり、普段のネットサーフィン時にはストレス無くページを表示する助けになるキャッシュだけれど、

開発をする際にはそのキャッシュが邪魔になってしまうということ。

 

そういうことで合っている、はず!


対象ファイルのみ修正する

 

そんなこんなで本題です。

 

調べてみたところ、変更したjavaファイルに変更日付を自動的に取得させてしまうという方法があった。

 

この仕掛けをjavaで作ってしまえばいいんですね?

 

ファイルの変更日付が変更されれば、パラメータも同時に変更されるというもの。

 

以下のjavaソースが、参考にさせてもらったサイトにあったものです。

 

 

/** 最終更新日時取得用書式定義 */
public class Util {
    /** 最終更新日時取得用書式定義 */
    private static SimpleDateFormat timestampFormat = new SimpleDateFormat("yyyyMMddhhmmss");
 
    /**
     * ファイルの最終更新日時を返す
     * @param path 対象となるファイル
     * @return 最終更新日時(yyyyMMddhhmmss)
     */
    public static String getLastModified(String path) {
        File file = new File(path);
        Long lastModified = file.lastModified();
        return timestampFormat.format(lastModified);
    }
}

 

 

そして、読み込み側のjspを以下のようにする。

 

<link href="css/style.css?date='<%= Util.getLastModified(config.getServletContext().getRealPath("css/style.css")) %>'" rel="stylesheet">

 

 

 

これで、変更したファイルの日付が変わるとパラメーターも同様に変わるので、確実にファイルの変更が反映されることになる。

 

ということが出来るようなので、JSPやjavaで開発しているときには利用してみるとストレスがなくなると思う。

 

cssやjsファイルを変更する度にキャッシュのクリアなんてしていたら面倒ですもんね。

 

以下、参考にさせて頂いたサイト様。

 

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