Laravelでcache bustingで検索するとLaravel Mixを使うという例しかでてこないのですが、Mixを使わずにやりたかったのでやり方を書きます。

環境


下記の環境で試してます。

  • PHP7.3
  • Laravel 6.0

方針


JSやCSSのパスの末尾にファイルのタイムスタンプを含めて返します。たとえばmain?1576386855などです。こうすることでファイルが更新された場合にキャッシュを使わずに新しいファイルを参照するようになります。

実装


この実装はこないだとあるリポジトリに出したPRをベースにしてます。

support cache busting feature for JavaScript and CSS

まず、ファイルのパスを受け取ってそのファイルのタイムスタンプを取得してパスの末尾の付与していつを返す関数を作成します。名前空間はプロジェクトによって変わると思うので適当に変えて下さい。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<?php

namespace App\Assets;

use Illuminate\Support\Facades\File;

class Helpers
{
/**
* Add UnixTimeStamp to file path suffix.
*
* @param string $filePath
*
* @return string
*/
public static function cacheBusting(string $filePath): string
{
if (File::exists($filePath)) {
$unixTimeStamp = File::lastModified($filePath);
return "{$filePath}?{$unixTimeStamp}";
}
return $filePath;
}
}

次にblade側でアセットを参照する箇所で上記の関数でファイルのパスをラップします。

1
<link type="text/css" rel="stylesheet" href="{{ App\Assets\Helpers::cacheBusting('main.css') }}">

結果


これを実行すると下記のようにファイルの末尾に?1576386855のようにタイムスタンプが付与されます。

おわり。