【Laravel】 複数ページで共通データをフロント側に渡す方法

今回やりたいこと

• Laravelで色んなページでよく使うデータをController毎にデータ定義して、フロント側に返すのではなく、共通でサーバ側からフロントへ渡せるようにしたい。

どうやって実現するのか

• Laravel view composer(ビューコンポーザ)というもので、下記公式ドキュメントの引用文を読むと実現できそうなので使ってみる。

ビューコンポーザは、ビューをレンダーするときに呼び出すコールバックまたはクラスメソッドです。
ビューをレンダーするたびにビューへ結合するデータがある場合、ビューコンポーザを使用すると、そのロジックを１つの場所に集約できます。
ビューコンポーザは、アプリケーション内の複数のルートかコントローラが同じビューを返し、常に特定のデータが必要な場合にきわめて役立ちます。

やってみる

おおまかな実装の流れ

1. サービスプロバイダファイルの作成
2. app.phpへSeriviceProviderの登録
3. ●●Composerクラスを作成
4. SeriviceProviderへの設定追加
5. フロント側で共通データの取得を確認

1.サービスプロバイダファイルの作成

• 下記を実行すると、サービスプロパイダファイルが作成されます。

$ php artisan make:provider ViewComposerServiceProvider

実行後...

app/Providers/ViewComposerServiceProvider.php

<?php

namespace App\Providers;

use Illuminate\Support\ServiceProvider;
use View;

/**
 * Class ViewComposerServiceProvider
 * @package App\Providers
 */
class ViewComposerServiceProvider extends ServiceProvider
{
    /**
     *
     */
    public function boot()
    {
    }

    /**
     * Register any application services.
     *
     * @return void
     */
    public function register()
    {
        //
    }
}

2. app.phpへSeriviceProviderの登録

config/app.php

    /*
    |--------------------------------------------------------------------------
    | Autoloaded Service Providers
    |--------------------------------------------------------------------------
    |
    | The service providers listed here will be automatically loaded on the
    | request to your application. Feel free to add your own services to
    | this array to grant expanded functionality to your applications.
    |
    */
    
    'providers' => [
        
        ...(略)
        
        /*
         * Application Service Providers...
         */

        // View Composer
        App\Providers\ViewComposerServiceProvider::class,
      
    ],

3. ●●Composerクラスを作成

• フロント側に共通で返したい用のクラスを作成します。
  • 下記例では、ユーザーに関する共通データをフロント側に返したいのでUserComposer.phpを作成します。

app/Http/ViewComposers/UserComposer.php

<?php

namespace App\Http\ViewComposers;

use Auth;
use Illuminate\View\View;

/**
 * Class UserComposer
 * @package App\Http\ViewComposers
 */
class UserComposer
{    
   
    /**
     * Bind data to the view.
     * @param View $view
     * @return void
     */
    public function compose(View $view)
    {
        $view->with([
            'current_user'   => Auth::user(),
            'user_id'        => Auth::id(),
            'user_name'      => Auth::user()->user_name,
            'user_image_url' => Auth::user()->user_image_url,  
            // ... ここに続けて共通で返したいデータを定義
        ]);
    }
}

4. SeriviceProviderへの設定追加

• View::composersメソッドを使って、下記部分に●●Composerが値を渡すviewのパスを指定して、値を返します。

app/Providers/ViewComposerServiceProvider.php

<?php

namespace App\Providers;

use Illuminate\Support\ServiceProvider;
use View;

/**
 * Class ViewComposerServiceProvider
 * @package App\Providers
 */
class ViewComposerServiceProvider extends ServiceProvider
{
    /**
     *
     */
    public function boot()
    {
+        // ここに追加
+        View::composers([
+            \App\Http\ViewComposers\UserComposer::class => '*', // 全てのviewに共通データを返す
+            \App\Http\ViewComposers\UserComposer::class => 'user.index', // resources\views\user\index.blade.phpに返したい場合の例
+            \App\Http\ViewComposers\UserComposer::class => 'user.*', // resources\views\user\配下の全てのviewに返したい場合の例
+        ]);
    }

    /**
     * Register any application services.
     *
     * @return void
     */
    public function register()
    {
        //
    }
}

5. フロントで共通データを表示

• フロント側で無事変数が取得できていたら完了！

app/resources/views/user/index.blade.php

<?php
    <div>
        <h6>{{ $user_name }}</h6>
        <img src="{{ $user_image_url }}">
    </div>

まとめ

• 共通で使用したいデータはビューコンポーザーを使用して、綺麗に共通化しておくととっても便利でした！

参考記事