thinkstream

共有データー

アプリケーション内の多数のページで、特定のデータにアクセスする必要がある場合があります。たとえば、サイトヘッダーに現在のユーザーを表示する必要があるかもしれません。アプリケーション全体のすべてのレスポンスで、このデータを毎回手動で渡すのは煩雑です。幸い、より良い方法があります。それが「共有データ」です。

データの共有

Inertia のサーバーサイドアダプターには、すべてのリクエストで利用可能な共有データを定義するためのメソッドが用意されています。これは通常、コントローラーの外で行われます。共有データは、コントローラーで提供されるページプロップと自動的にマージされます。

Laravel アプリケーションでは、これは通常、サーバーサイドアダプターをインストールした際に自動的に追加される HandleInertiaRequests ミドルウェアで処理されます。

php
class HandleInertiaRequests extends Middleware
{
    public function share(Request $request)
    {
        return array_merge(parent::share($request), [
            // 同期的に...
            'appName' => config('app.name'),

            // 遅延的に...
            'auth.user' => fn () => $request->user()
                ? $request->user()->only('id', 'name', 'email')
                : null,
        ]);
    }
}

または、Inertia::share メソッドを使用して手動でデータを共有することもできます。

php
use Inertia\Inertia;

// 同期的に...
Inertia::share('appName', config('app.name'));

// 遅延的に...
Inertia::share('user', fn (Request $request) => $request->user()
    ? $request->user()->only('id', 'name', 'email')
    : null
);

共有データは、すべてのレスポンスに含まれるため、必要最小限に留めるべきです。

ページプロップと共有データはマージされるため、衝突を避けるために共有データには適切な名前空間を付けてください。

一度だけ共有するプロップ

once props を使用すると、一度だけ解決され、以降のナビゲーションでもクライアント側で記憶されるデータを共有できます。

php
class HandleInertiaRequests extends Middleware
{
    public function share(Request $request)
    {
        return array_merge(parent::share($request), [
            'countries' => Inertia::once(fn () => Country::all()),
        ]);
    }
}

または、ミドルウェアに専用の shareOnce() メソッドを定義することもできます。この場合、ミドルウェアは share() と shareOnce() の両方を評価し、その結果をマージします。

php
class HandleInertiaRequests extends Middleware
{
    public function shareOnce(Request $request): array
    {
        return array_merge(parent::shareOnce($request), [
            'countries' => fn () => Country::all(),
        ]);
    }
}

Inertia::shareOnce() メソッドを使用して、手動で once プロップを共有することも可能です。

php
Inertia::shareOnce('countries', fn () => Country::all());

共有データへのアクセス

サーバーサイドでデータを共有すると、任意のページやコンポーネント内でそのデータにアクセスできるようになります。以下は、レイアウトコンポーネントで共有データにアクセスする例です。

TypeScript

TypeScript の宣言マージを使用して、共有プロップの型をグローバルに設定できます。

フラッシュデータ

トーストメッセージや成功アラートのような一度限りの通知には、フラッシュデータを使用できます。共有データとは異なり、フラッシュデータはブラウザーの履歴状態には保持されないため、履歴を遡ってナビゲーションした際に再表示されることはありません。