PHPでCSSキャッシュバスターを実装する(その2)

前回設定したキャッシュバスターですが、メインのCSSにだけ利用していたのですが、JSにも使ってみることにしました。

というのも、男子ハックで は海外のCDNサービスであるCloudFlareを使っているので、HTMLやら画像やらJSがキャッシュされていて、毎度それを削除するのが非常に面倒なんです。

ということでWordpressの関数とPHPを組み合わせてこんな感じになりました。

<?php
function echo_url_with_filedate($file_name) {
    $tmp_dir_uri = get_template_directory_uri();
    $file_path = dirname(__FILE__)."/".$file_name;
    if (file_exists($file_path)) {
        $file_date = date('YmdHis', filemtime($file_path));
        echo $tmp_dir_uri."/".$file_name."?date=".$file_date;
?>
<script src="<?php echo_url_with_filedate("js/content-auto-adsense.js") ;?>"></script>

こいつを使うとURLのクエリパラメータにCSSやJSファイルを編集した時刻が挿入されるので、編集するたびにブラウザくんが新しいファイルを読みに行ってくれるわけです。

// いままで
<script src="http://www.danshihack.com/wp-content/themes/cedar/js/content-auto-adsense.js"></script>

// これから
<script src="http://www.danshihack.com/wp-content/themes/cedar/js/content-auto-adsense.js?date=20141103121536"></script>

ここを参考にしました。

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