Laravel 12 + Fortify その2　UIとの連携例（Blade等）


## はじめに
前回の記事「その1」では、Laravel 12 + Fortifyでカスタム認証（ユーザーコード認証など）のバックエンド実装について解説しました。  
今回は、FortifyのAPI認証とBladeテンプレート（UI）を連携し、カスタム認証フォームを作成する方法をまとめます。

---

## 前提

- Laravel 12 プロジェクト
- Fortify導入＆カスタム認証（`Fortify::authenticateUsing`）済み
- Laravel BreezeやJetstream等のUIパッケージは無し（Bladeを自作する想定）

---

## 1. ルーティングの確認

FortifyはAPIベース認証ですが、`config/fortify.php` の `'views' => true,` を有効にしておくとBladeビューを利用できます。

```php
// config/fortify.php
'views' => true,
```

---

## 2. Bladeでログインフォームを作成

`resources/views/auth/login.blade.php` を作成します。

```blade name=resources/views/auth/login.blade.php
@extends('layouts.app')

@section('content')
<div class="container">
    <h2>カスタムログイン</h2>
    @if(session('error'))
        <div style="color: red">{{ session('error') }}</div>
    @endif
    <form method="POST" action="{{ route('login') }}">
        @csrf
        <div>
            <label for="user_code">ユーザーコード：</label>
            <input type="text" name="user_code" id="user_code" value="{{ old('user_code') }}" required autofocus>
        </div>
        <div>
            <label for="password">パスワード：</label>
            <input type="password" name="password" id="password" required>
        </div>
        <button type="submit">ログイン</button>
    </form>
</div>
@endsection
```

---

## 3. ログイン画面へのルート

`routes/web.php` に以下を追加（既定でFortifyが`/login`ルートを用意していますが、明示的にBladeを返したい場合は上書きも可能です）

```php
use Illuminate\Support\Facades\Route;

Route::get('/login', function () {
    return view('auth.login');
})->name('login')->middleware('guest');
```

---

## 4. 認証失敗時のエラーハンドリング

`app/Providers/FortifyServiceProvider.php` の `boot` メソッドで、失敗時にリダイレクト＆エラー表示できるようにします。

```php
use Illuminate\Http\Request;
use Illuminate\Support\Facades\Auth;
use Illuminate\Support\Facades\Redirect;

public function boot()
{
    Fortify::authenticateUsing(function (Request $request) {
        // ...カスタム認証処理...
    });

    // 認証失敗時の挙動カスタマイズ
    app('router')->post('login', function (Request $request) {
        $credentials = $request->only('user_code', 'password');
        if (Auth::attempt(['user_code' => $credentials['user_code'], 'password' => $credentials['password']])) {
            $request->session()->regenerate();
            return redirect()->intended('/dashboard');
        }
        return Redirect::back()->withInput()->with('error', 'ユーザーコードまたはパスワードが正しくありません');
    })->middleware(['guest']);
}
```
※ Fortifyのコアをオーバーライドしない場合は、コントローラやカスタムリダイレクトもOK。

---

## 5. ログイン後のリダイレクト

`FortifyServiceProvider` の `redirectTo` をカスタマイズ可能です。または、`config/fortify.php` の `home` を編集します。

```php
// config/fortify.php
'home' => '/dashboard',
```

---

## 6. ダッシュボード画面の作成例

```blade name=resources/views/dashboard.blade.php
@extends('layouts.app')

@section('content')
<div class="container">
    <h2>ダッシュボード</h2>
    <p>ようこそ、{{ Auth::user()->name }}さん！</p>
    <form method="POST" action="{{ route('logout') }}">
        @csrf
        <button type="submit">ログアウト</button>
    </form>
</div>
@endsection
```

---

## 7. まとめ

- FortifyでAPI認証でも、BladeビューでUIを柔軟に作成可能
- カスタム入力項目（ユーザーコード等）もBladeフォームに自由に追加できる
- 認証失敗時のエラー表示やリダイレクトもカスタマイズしやすい

---

### 参考

- [Laravel Fortify 公式ドキュメント](https://laravel.com/docs/12.x/fortify)
- [Fortify: Viewsのカスタマイズ](https://laravel.com/docs/12.x/fortify#views)
- [Laravel UI: Bladeテンプレート](https://laravel.com/docs/12.x/blade)