タスク管理アプリ③ 〜ログインユーザーのid・nameを取得し、ビューに表示させる〜

はじめに

今回は、前回作成したログイン機能でログインしたユーザーのid・nameを取得し、リダイレクト先のviewに表示させることを目的としています。
※学習用なので、セキュリティ面は考慮できていません。

前回の記事↓
https://qiita.com/kuro_maru/items/7662cd11603ac70d70f9

初回アクセス時の遷移先をログイン画面にする

ユーザーが初回アクセスした際に、デフォルトだとwelcomeページへ遷移するようになっているので、/loginに遷移するよう設定していきます。

routes/web.php

// ログインページへリダイレクト設定
Route::get('/', function () {
    return redirect()->route('login');
});

redirect()->route();
route()で指定したルートにリダイレクトさせることができます。

▼以下の記事が分かりやすかったです
https://qiita.com/manbolila/items/767e1dae399de16813fb

ログインユーザーのidとnameを取得する

ログイン処理は、laravel bleezeを使用し行っているので、すでにcontrollerなどは存在している状態です。

app/Http/Controllers/Auth/AuthenticatedSessionController.php

public function store(LoginRequest $request): RedirectResponse
    {
        $request->authenticate();

        $request->session()->regenerate();

        // ログイン情報からidを取得
        $userId = Auth::user()->id;

        // リダイレクト先に、user idを渡す
        return redirect()->route('dashboard', ['id' => $userId]);
    }

Auth::user()
ログイン情報からユーザーのデータを取得します。
※Auth::user()->id; これでユーザーidの取得を行っています。

ルートに関連したコントローラーが呼び出される

routes/web.php

// dashboardへのルート設定 ※今後増やす予定なのでgroupにする
Route::middleware('auth')->group(function () {
  Route::get('/dashboard', [DashboardController::class, 'getUserData'])->name('dashboard');
});

routes/web.php, routes/api.phpを参照するタイミングについて
① リクエストがアプリケーション(laravel)に到達
② アプリケーションは、リクエストURLと一致したルートを探す
③ 一致したルートに関連したコントローラーを呼び出す
④ コントローラーアクションによってレスポンスを返す

リダイレクト先で、httpリクエストからユーザー名を取得する

app/Http/Controllers/Auth/DashboardController.php

// ログインリクエストが送られてきたら、リクエスト内からデータを取得
    public function getUserData(Request $request)
    {
      // $requestからユーザー名を取得
      $userName = $request->user()->name;

      return view('dashboard', ['userName' => $userName]);
    }

$requestは、httpリクエストのことでユーザー名を取得しています。
取得したユーザー名をviewに指定したdashboardへ渡しています。

viewで渡ってきたデータを表示させる

resources/views/dashboard.blade.php

<x-app-layout>
    <x-slot name="header">
        <h2 class="font-semibold text-xl text-gray-800 leading-tight">
            {{ __('Dashboard') }}
        </h2>
    </x-slot>

    <div class="py-12">
        <div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
            <div class="bg-white overflow-hidden shadow-sm sm:rounded-lg">
                <div class="p-6 text-gray-900">
                    <!-- ユーザー名を表示させる -->
                    こんにちは, {{ $userName }}さん!
                </div>
            </div>
        </div>
    </div>
</x-app-layout>

※デフォルトのを使用

これでログイン後、ダッシュボードにログインしたユーザー名が表示されるようになりました。