Laravel cssやjsにタイムスタンプを付けてキャッシュを更新させる

Laravelでcssやjsを変更した際にブラウザのキャッシュを更新させる方法です。

かんたんに使いまわせるようにBlade拡張でディレクティブを作成します。

AppServiceProvider.php
public function boot()
    {
        \Blade::directive('addtimestamp', function ($expression) {

            // ファイルのパスを取得
            $path = public_path($expression);

            // ファイルパスを指定して、更新時間を取得
            $timestamp = \File::lastModified($path);

            // 更新時間が取得できなかった場合
            if ($timestamp === false) {
                $timestamp = Carbon::now()->timestamp;
            }

            // ファイルパスの後ろにタイムスタンプを追加
            $path = asset($expression) . '?v=' . $timestamp;

            return $path;

        });
    }

bladeの中ではこのように使います。
<link rel="stylesheet" href="@addtimestamp(css/index.css)" />

このように出力されます。

<link rel="stylesheet" href="https://example.com.jp/css/index.css?v=1521625069" />

注意点

bladeは最初の表示でキャッシュされるので、2回目以降は@addtimestampは読み込まれません。
cssだけ更新してもタイムスタンプは変わらないので、php artisan view:clearなどでキャッシュをクリアしてください。
Jenkinsなどでリリースしている場合は、キャッシュをクリアするコマンドを追加するとよいと思います。

Sign up for free and join this conversation.
Sign Up
If you already have a Qiita account log in.