認証処理

はじめに

システムと言えば【認証】です!!
認証処理を導入する事で、ユーザーの管理や、処理の振り分けなど様々な利用用途があります。
そこでLaravelに標準に用意されている認証機能をインストールしてみましょう。

その前にあなたの環境を確認する必要があります。
『public』ディレクトリを使用していますか？
もし【WEBROOT】をカスタマイズにより変更している場合や、コンテキストルートを設定している場合は設定を追記する必要があります。
今回は【{webroot}/{コンテキストルート}】直下に認証関連の公開ソースをインストールしてみます。
以下ソースを修正します（[artisan]のあるディレクトリ）。

vite.config.js

export default defineConfig({
    plugins: [
        laravel({
            input: ['resources/css/app.css', 'resources/js/app.js'],
            refresh: true,
        }),
        tailwindcss(),
    ],
    server: {
        watch: {
         ignored: ['**/storage/framework/views/**'],
        },
    },
    build: {
        outDir: 'C:\\～\\laravel_12\\laravel_12\\build',
        emptyOutDir: true,
    },
});

※ エスケープのため「\\」と記述する事
※「build」オブジェクトを追加する

インストール

それではインストールします。
[artisan]があるディレクトリでターミナルを開き以下を叩きます。

ターミナルを叩く

C:\～\laravel_12>composer require laravel/ui
  ./composer.json has been updated
  Running composer update laravel/ui
  Loading composer repositories with package information
  Updating dependencies
  Lock file operations: 1 install, 0 updates, 0 removals
    - Locking laravel/ui (v4.6.1)
  Writing lock file
  Installing dependencies from lock file (including require-dev)
  Package operations: 1 install, 0 updates, 0 removals
     - Downloading laravel/ui (v4.6.1)
     - Installing laravel/ui (v4.6.1): Extracting archive
  Generating optimized autoload files
  > Illuminate\Foundation\ComposerScripts::postAutoloadDump
  > @php artisan package:discover --ansi
      [37;44m INFO [39;49m Discovering packages.
      laravel/pail [90m. [39m [90m. [39m [90m. [39m [90m. [39m...
～省略～
  82 packages you are using are looking for funding.
  Use the `composer fund` command to find out more!
  > @php artisan vendor:publish --tag=laravel-assets --ansi --force
  [37;44m INFO [39;49m No publishable resources for tag [1m[laravel-assets] [22m.
  No security vulnerability advisories found.
  Using version ^4.6 for laravel/ui

C:\～\laravel_12>

ポイント

laravel/ui は、Laravel 6 以降で使われる、認証用のUIや Bootstrap / Vue / React ベースのフロントエンドスカフォールドを提供する公式パッケージです。

つづいて以下を叩きます。
　※ 対話型となりますが、基本的にはリターンを叩けば問題ありません。

エラー？

C:\～\laravel_12>php artisan ui vue --auth
  The [auth/login.blade.php] view already exists. Do you want to replace it? (yes/no) [no]

  The [auth/passwords/confirm.blade.php] view already exists. Do you want to replace it? (yes/no) [no]

  The [auth/passwords/email.blade.php] view already exists. Do you want to replace it? (yes/no) [no]

  The [auth/passwords/reset.blade.php] view already exists. Do you want to replace it? (yes/no) [no]

  The [auth/register.blade.php] view already exists. Do you want to replace it? (yes/no) [no]

  The [auth/verify.blade.php] view already exists. Do you want to replace it? (yes/no) [no]

  The [home.blade.php] view already exists. Do you want to replace it? (yes/no) [no]

  The [layouts/app.blade.php] view already exists. Do you want to replace it? (yes/no) [no]

  The [HomeController.php] file already exists. Do you want to replace it? (yes/no) [yes]

  The [Controller.php] file already exists. Do you want to replace it? (yes/no) [yes]

    INFO Authentication scaffolding generated successfully.
    INFO Vue scaffolding installed successfully.
    WARN Please run [npm install && npm run dev] to compile your fresh scaffolding.

C:\～\laravel_12>

もし以下メッセージが表示された場合はインストール失敗となります。
　WARN Please run [npm install && npm run dev] to compile your fresh scaffolding.
パッケージ《npm》がない事が原因です。

また、先ほど「vite.config.js」で設定した場所に『build』ディレクトリが作成されていれば成功です。
以下内容は無視し、次の説明へお進みください。

○ 追加コマンドを叩きます

① npm install

エラーになる場合は以下の【[nvm]のインストール】を実施してください。
実施後再度①を叩き、再度エラーの場合は以下を叩く。

pm install --legacy-peer-deps
※ パッケージのバージョンが合わないため非推奨だが無視して実行

② npm run build

これで「build」ディレクトリが作成されるハズです。

[nvm]のインストール

○ [npm]のインストールに必要な[nvm]のインストール

ダウンロードサイトより【nvm-setup.zip】をダウンロードする。
解凍すると実行ファイルとなるので、叩いてインストールします。
※ インストールしたら環境変数へ[path]を必ず登録しておく（[artisan]のある場所からコマンドが叩けない）

○ Node.js をインストール

ターミナルより以下を叩きンストール可能な Node.js のバージョンを表示します。

nvm list available

表示された一覧の LTS (Long Term Support) の一番上のバージョンをインストールします。
例）

nvm install 22.17.0

以下のコマンドでインストールしたバージョンに切り替えます。

npm -version

認証の挙動確認

以下へアクセスしてみましょう。

localhost/{コンテキスト名}/home

認証が機能していなければ当然アドレスは[home]のままですが、「login」となっているハズです。
これは認証機能が働き、「login」画面にリダイレクト処理されたためです。

エラーになる場合

Laravelが要求する「public」ディレクトリ直下に『build』ディレクトリが作成されてますか？
「public」は公開ディレクトリですので、Apacheで設定している【WebRoot】か、更に下層へ設置する必要があります。
本解説では「public」は「laravel_12」へリネームし、[WebRoot]直下に設置しています。
　※詳しくは『ディレクトリ構造を変更する』参照

Laravelは「public」ディレクトリを「artisan」がある階層から探そうとします。
エラーになる場合は、今一度自信のディレクトリ構造を見直してください。

それではデフォルトのソース構成を見ていきましょう。

～\routes\web.php

<?php
use Illuminate\Support\Facades\Route;
Auth::routes();
Route::get('/home', [App\Http\Controllers\HomeController::class, 'index'])->name('home');

『Auth::routes()』Laravelお手軽認証用定義となり、この状態では何も発火しません。
更に認証制御下とするコントローラ『HomeController』が自動で生成されます。

HomeController.php

<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
class HomeController extends Controller {
    public function __construct() {
        $this->middleware('auth');
    }
    public function index() {
        return view('home');
    }
}

注目すべきはコンストラクタの記述『$this->middleware('auth');』となります。
この制御をする事で、「web.php」内に定義した認証ルールの対象となります。

その他コントローラ
　自動生成されるコントローラは以下の様に沢山あります。

○ ～\app\Http\Controllers\Auth\ConfirmPasswordController.php
○ ～\app\Http\Controllers\Auth\VerificationController.php
○ ～\app\Http\Controllers\Auth\ForgotPasswordController.php
○ ～\app\Http\Controllers\Auth\LoginController.php
○ ～\app\Http\Controllers\Auth\RegisterController.php
○ ～\app\Http\Controllers\Auth\ResetPasswordController.php

　ビューは以下が生成されます。

○ ～\resources\views\home.blade.php
○ ～\resources\views\auth\login.blade.php
○ ～\resources\views\auth\register.blade.php
○ ～\resources\views\auth\verify.blade.php
○ ～\resources\views\auth\passwords\confirm.blade.php
○ ～\resources\views\auth\passwords\email.blade.php
○ ～\resources\views\auth\passwords\reset.blade.php

認証の設定

初期状態では先ほど紹介したコントローラ「HomeController.php」のコンストラクタで設定しています。
　$this->middleware('auth');

コンストラクタで設定しているため、他のコントローラで認証対象にしたい場合は、各コンストラクタ単位に設定する必要があります。
ただしこの設定方法は非効率だし、一目でどのコントローラが認証対象かも分かりにくいため、ルーティングからの設定がおすすめです。
まずは『HomeController』のコンストラクタ内のコードを消しちゃいましょうっ!!
すると当然ですが、URL「home」へ遷移する事が可能となります。

次に「web.php」の内容を修正します。

～\routes\web.php

Auth::routes();
Route::group(['middleware' => 'auth'], function(){
Route::get('/home', [App\Http\Controllers\HomeController::class, 'index'])->name('home');
});

この状態で再度URL「home」へアクセスしてみてください。
「login」へリダイレクトされましたよね!!
これで認証制御されているコントローラの見分けが容易になりました。

ユーザー登録

それでは「login」画面から右上にある《Register》リンクをクリックし、ユーザー登録してみましょう。
例）

Name                             hoge_user
Email Address            [email protected]
Password                     hoge0000

登録が完了すると自動的に「home」へリダイレクトされているのが確認できましたか？
要するにあなたは今「ログイン」している状態です。

ちょこっとカスタマイズ

ログインを「email」ではなく「username」で行う様にしてみましょう。
以下ファイルを修正します。

～\auth\login.blade.php

<div class="row mb-3">
    <label for="name" class="col-md-4 col-form-label text-md-end">{{ __('Name') }}</label>
    <div class="col-md-6">
        <input id="name" type="text" class="form-control @error('name') is-invalid @enderror" name="name" value="{{ old('name') }}" required autocomplete="name" autofocus>
        @error('name')
            <span class="invalid-feedback" role="alert">
                <strong>{{ $message }}</strong>
            </span>
        @enderror

『name属性』部分の抜粋です。

～\app\Http\Controllers\Auth\LoginController.php

    public function username() {
        return 'name';
    }

メソッドを追加します。

～\app\Http\Controllers\Auth\RegisterController.php

protected function validator(array $data) {
    return Validator::make($data, [
        'name' => ['required', 'string', 'max:255', 'unique:users'],
        'email' => ['required', 'string', 'email', 'max:255', 'unique:users'],
        'password' => ['required', 'string', 'min:8', 'confirmed'],
    ]);
}

ユーザー名を認証に使用する場合は、ユニークにする必要があるためバリデーションを修正します。

設定は以上となります。
一旦ログアウトし、再度「メール」「パスワード」で認証してみてください。
バリデーションエラーになりましたよね？
次に「ユーザー名」「パスワード」で認証できれば、カスタマイズは成功です。

目次