【超初心者向け】Laravel Breezeをつかってログイン機能を作ってみよう

投稿日: 投稿者:

Webアプリケーション開発の第一歩として、ユーザー認証機能の実装は避けて通れません。しかし、ゼロからすべてをコーディングするのは非常に大変です。でも大丈夫。PHPフレームワークのLaravelを使えば、誰でも驚くほど簡単に、そしてセキュアにログイン機能を実装できます。この記事では、Laravelの強力なパッケージ「Laravel Breeze」を活用して、ログイン、ログアウト、ユーザー登録といった一連の認証機能をたった数コマンドで完成させる方法を、初心者の方にも分かりやすく、丁寧に解説します。

なぜLaravelでログイン機能を作るのか？ 🤔

Webサービスやアプリケーションを開発する際、ユーザーごとにパーソナライズされた体験を提供したり、特定の情報を保護したりするために、ログイン機能は不可欠です。しかし、認証機能は単にフォームとパスワードのチェックだけでなく、セキュリティ、パスワードのハッシュ化、セッション管理など、考慮すべき点が多岐にわたります。Laravelは、これらの複雑な処理を抽象化し、フレームワークの内部に組み込んでいます。これにより、開発者はセキュリティの専門知識がなくても、堅牢で安全な認証システムを簡単に構築できるのです。特に、Laravelでは、Laravel Breezeという公式パッケージを利用することで、必要最低限の認証機能を驚くほど速く、かつ美しく実装できます。

🛠 前提条件と開発環境の準備

このチュートリアルをスムーズに進めるために、以下の環境を事前に準備しておきましょう。これらのツールは、現代のPHP開発において必須のものです。

  • PHP 8.1以上: LaravelはPHP 8.1以上が必要です。
  • Composer: PHPの依存関係を管理するツールです。パッケージのインストールに利用します。
  • Laravel: 今回使用するフレームワークです。
  • MySQLなどのデータベース: ユーザー情報を保存するために必要です。SQLiteでも問題ありません。
  • ターミナル（コマンドプロンプト）: コマンドを実行するために使います。

Laravelプロジェクトの作成:
まずは、コマンド一つで新しいLaravelプロジェクトを作成します。login-demoという名前でプロジェクトを作成し、そのディレクトリに移動して開発サーバーを起動します。これにより、ブラウザでアクセスできるようになります。

composer create-project laravel/laravel login-demo
cd login-demo
php artisan serve

コマンド実行後、ブラウザで http://127.0.0.1:8000 にアクセスし、Laravelの初期画面が表示されることを確認してください。

🧙‍♂️ Laravel Breezeでログイン機能を導入する

いよいよ本題です。Laravel Breezeは、ユーザー登録、ログイン機能、パスワードリセット、メール認証といった基本的な認証機能を、簡単にスキャフォールディング（骨組みを自動生成）してくれる公式パッケージです。これにより、フロントエンドとバックエンドの認証ロジックがまとめて生成されます。

以下のコマンドを順番に実行してください。

composer require laravel/breeze --dev

このコマンドで、Breezeパッケージを開発環境にインストールします。

php artisan breeze:install

このコマンドが認証の「骨組み」を生成する魔法のコマンドです。実行すると、使用するスタック（Blade、React、Vueなど）を選択するよう求められます。今回は、Bladeを選択しましょう。その後、ダークモードのサポートやPestテストフレームワークのインストールについても聞かれますが、今回はNoで進めて問題ありません。

npm install && npm run dev

認証画面の表示に必要なJavaScriptやCSSなどのフロントエンド資産をビルドします。このコマンドは、Node.jsとnpmが必要です。まだインストールしていない場合は、事前に準備しておきましょう。

php artisan migrate

最後に、データベースに認証に必要なテーブル（usersテーブルなど）を作成します。データベースの接続情報が.envファイルに正しく設定されていることを確認してください。

👀 実際にログイン機能を動作確認してみよう

上記のステップが完了したら、もうログイン機能が使えるようになっています！ブラウザで開発サーバーにアクセスしてみましょう。

まず、URLの末尾に /register を追加してアクセスしてみてください。ユーザー登録フォームが表示されるはずです。ここで名前、メールアドレス、パスワードを入力して登録してみましょう。登録が成功すると、ダッシュボード画面にリダイレクトされます。

次に、一度ログアウトして、今度は /login にアクセスしてみましょう。先ほど登録したメールアドレスとパスワードでログインできることを確認してください。Laravel Breezeが生成したログイン画面は、非常にシンプルで直感的に操作できます。

🔍 ユーザー登録処理の仕組みを理解する

Breezeが生成したコードを見てみましょう。特に、ユーザー登録処理を担うapp/Http/Controllers/Auth/RegisteredUserController.phpのstoreメソッドは、以下の処理を行っています。

public function store(Request $request)
{
    $request->validate([
        'name' => ['required', 'string', 'max:255'],
        'email' => ['required', 'string', 'email', 'max:255', 'unique:users'],
        'password' => ['required', 'confirmed', Rules\Password::defaults()],
    ]);

    $user = User::create([
        'name' => $request->name,
        'email' => $request->email,
        'password' => Hash::make($request->password),
    ]);

    Auth::login($user);

    return redirect(RouteServiceProvider::HOME);
}

このコードは以下の重要な処理を含んでいます。

  • バリデーション: 送信されたデータが正しい形式か、必須項目が入力されているかを厳格にチェックします。特に、メールアドレスがunique:usersで一意であること、パスワードがconfirmed（確認用パスワードと一致）であることを検証しています。
  • パスワードのハッシュ化: Hash::make()によって、平文のパスワードを不可逆な文字列に変換して保存します。これにより、万が一データベースが流出しても、パスワードそのものが漏洩するのを防ぎます。
  • ログイン: Auth::login($user)によって、登録したユーザーで即座にログイン状態にします。

🔍 ログイン処理の仕組みを理解する

ログイン機能の処理は、app/Http/Controllers/Auth/AuthenticatedSessionController.phpのstoreメソッドで行われます。このメソッドは以下の重要な処理を含んでいます。

public function store(Request $request)
{
    $request->validate([
        'email' => ['required', 'string', 'email'],
        'password' => ['required', 'string'],
    ]);

    if (!Auth::attempt($request->only('email', 'password'))) {
        throw ValidationException::withMessages([
            'email' => __('auth.failed'),
        ]);
    }

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

    return redirect()->intended(RouteServiceProvider::HOME);
}

このコードは以下の処理を行っています。

  • バリデーション: メールアドレスとパスワードが必須項目であることをチェックします。
  • 認証試行: Auth::attempt()メソッドが、入力されたメールアドレスとパスワードを使ってデータベースと照合します。この際、パスワードのハッシュ化も自動的に行われます。認証に失敗した場合、ValidationExceptionを投げ、ユーザーにエラーメッセージを表示します。
  • セッションの再生成: 認証成功後、セキュリティのためにセッションを再生成します。これはセッションフィクセーション攻撃を防ぐための重要なセキュリティ対策です。
  • リダイレクト: ユーザーが元々アクセスしようとしていたページ（intended）にリダイレクトします。

🧪 ログイン状態の確認とアクセス制限

ログインしたユーザーだけがアクセスできるページを作成するのは非常に簡単です。Laravelのミドルウェアを利用します。authミドルウェアは、リクエストが処理される前にユーザーが認証済みかどうかをチェックするフィルターのような役割を担います。

以下の例では、/dashboardというURLにアクセスする際に、ユーザーがログインしていなければ自動的にログインページにリダイレクトされるようになります。

Route::get('/dashboard', function () {
    return view('dashboard');
})->middleware(['auth']);

このように、たった一行のコードで簡単にアクセス制御を実装できるのがLaravelの魅力です。

🧼 ログアウト機能の設置

ログイン機能とセットで必要なのがログアウト機能です。Laravel Breezeが生成したテンプレートには既にログアウトボタンが含まれていますが、その仕組みを理解しておきましょう。

Bladeテンプレート上で、ログアウトのためのフォームを以下のように記述します。

<form method="POST" action="{{ route('logout') }}">
    @csrf
    <button type="submit" class="btn btn-danger">ログアウト</button>
</form>

このフォームは、POSTメソッドでroute('logout')というURLにリクエストを送信します。@csrfディレクティブは、クロスサイトリクエストフォージェリ（CSRF）攻撃を防ぐための重要なセキュリティ対策です。Laravelは、このフォームからのリクエストを受け取ると、認証済みのセッションを破棄し、ユーザーをログアウトさせます。

🧠 初心者が知っておくべきつまずきポイントと解決策

初めてLaravelを使う方が戸惑いがちなポイントとその解決策をいくつか紹介します。

✅ マイグレーションが通らない:

php artisan migrateコマンドを実行した際にエラーが発生する場合、データベースの接続設定に誤りがある可能性が高いです。プロジェクトルートにある.envファイルを開き、以下のDB設定が正しいかを確認してください。

DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=your_database_name
DB_USERNAME=your_username
DB_PASSWORD=your_password

特に、DB_DATABASEに指定したデータベースが、MySQLなどのデータベースサーバーに存在していることを確認しましょう。

✅ npm run devが失敗する:

このエラーは、Node.jsまたはnpmが正しくインストールされていない場合に発生することが多いです。コマンドプロンプトで以下のコマンドを実行し、バージョンが表示されるか確認しましょう。

node -v
npm -v

もしバージョンが表示されない場合は、Node.jsの公式サイトからインストーラーをダウンロードしてインストールし、再度試してみてください。

🎉 まとめ。Laravel Breezeは初心者でも安全に簡単に速く認証機能が作れる

この記事では、Laravelの認証機能を手軽に実装する方法を解説しました。Laravel Breezeを使うことで、複雑な認証ロジックやセキュリティ対策を意識することなく、数分でログイン機能を完成させることができました。これは魔法ではなく、Laravelが開発者の手間を最小限に抑えるために提供している強力な「時短ツール」です。この仕組みを理解し、さらにカスタマイズすることで、あなたのWeb開発はもっと楽しく、効率的になるでしょう。ぜひ、この知識を活かして、あなただけのWebアプリケーション開発に挑戦してみてください！