search
LoginSignup
5
Help us understand the problem. What are the problem?

More than 5 years have passed since last update.

posted at

updated at

LaravelでBladeを拡張する(@asset( ))

概要

css, js, imgなどの外部ファイルのキャッシュ対策として、フィンガープリントを入れたい。
ただし、ファイル名を変えるとなると大変なる。
そのため、更新日時のクエリパラメータを付けることにしたので、メモとして残します。

ServiceProviderを追加する

「AppServiceProvider.php」にBladeの拡張を書く記事を見かけるが、
ちょっと微妙な感じがするので、新設する。

app/Providers/BladeServiceProvider.php
<?php

namespace App\Providers;

use Illuminate\Support\ServiceProvider;
use Illuminate\Support\Facades\Blade;

/**
 * Blade拡張
 *
 * @package App\Providers
 */
class BladeServiceProvider extends ServiceProvider
{
    /**
     * コンテナ結合の登録
     *
     * @return void
     */
    public function boot()
    {
        /**
         * JS,CSSなどのパスにフィンガープリント(更新日時)を追加する
         *
         * @param   string $file ファイルパス
         * @return  string
         */
        Blade::directive('asset', function ($file) {
            $file = str_replace(["'", '"'], "", $file);
            $path = public_path() . $file;
            try {
                // [注意] view:cacheにならないようPHPのスクリプトを返す
                $opt = "?<?php echo \File::lastModified('{$path}') ?>";
            } catch(\Exception $e) {
                // ファイルが無い場合はスキップ
                $opt = '';
            }
            return secure_asset($file).$opt;
        });
    }

    /**
     * サービスプロバイダー登録
     *
     * @return void
     */
    public function register()
    {
        //
    }
}

新規に作ったクラスを読み込む

config/app.php
    'providers' => [

               
               
               

        App\Providers\BladeServiceProvider::class,

    ],

実行してみる

下記のように各Bladeのテンプレート内で実行してみる

<link rel="stylesheet" href="@asset('/css/app.css')">
<script src="@asset('/js/jquery.min.js')"></script>
<img src="@asset('/img/sample.png')" alt="sample">

以上

参考サイト

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
What you can do with signing up
5
Help us understand the problem. What are the problem?