Laravel用の管理画面コンポーネント集のfilamentを使って管理者ログイン機能と管理画面を構築していきます。
![](https://filamentphp.com/images/og.jpg)
前提条件
- PHP8.2以降インストール済(Laravel11の要件)
- Composerインストール済
要件の確認
一般ユーザーと管理者権限ユーザーの多重認証をします。
▼一般ユーザー
- ◎:/register から新規登録可
- ◎:/login からログイン可
- ✖:/admin/login からログイン不可
▼管理者権限ユーザー
- ◎:Artisanコマンドで新規登録可
- ✖:/register から新規登録不可
- ◎:/login からログイン可
- ◎:/admin/login からログイン可
これからやること
- Laravel11プロジェクト作成
- Breezeインストール
- filamentインストール
- filamentユーザー新規登録(一般ユーザー)
- 管理画面ログイン
- 設定変更
- マイグレーション
- Userモデル編集
- Artisanコマンド作成
- 管理者権限ユーザー作成
- 管理画面ログイン
Laravel11プロジェクト作成
新規プロジェクト「filament-app」を作成します。
composer create-project laravel/laravel:^11 filament-app
![](https://macocci7.net/blog/wp-content/uploads/2024/05/laravel11_filament_install_01.png)
プロジェクトフォルダに入ります。
cd filament-app
![](https://macocci7.net/blog/wp-content/uploads/2024/05/laravel11_filament_install_02.png)
Breezeインストール
Breezeをインストールします。
composer require laravel/breeze
![](https://macocci7.net/blog/wp-content/uploads/2024/05/laravel11_filament_install_03.png)
breezeをLaravelで使えるようにします。
php artisan breeze:install
![](http://macocci7.net/blog/wp-content/uploads/2024/05/laravel11_filament_install_04.png)
スタックの選択は多分何でもOKです。
「Blade with Alpine」でも動作確認できています。
filamentインストール
続いて、filamentをインストールします。
composer require filament/filament:^3.2 -W
![](https://macocci7.net/blog/wp-content/uploads/2024/05/laravel11_filament_install_05.png)
Panel Builder をインストールします。
php artisan filament:install --panels
![](https://macocci7.net/blog/wp-content/uploads/2024/05/laravel11_filament_install_06.png)
「What is the ID?」と訊かれますが、
これは、管理画面のURLだと思ってください。
「admin」で登録すると、管理画面のURLは
となります。
間違って登録しても、後から修正できます。
ここでは、とりあえずデフォルトの「admin」で登録します。
そのまま[Enter]で確定します。
![](https://macocci7.net/blog/wp-content/uploads/2024/05/laravel11_filament_install_07.png)
インストール完了すると
「GitHubリポジトリでスターしてくれない?」と訊かれます。
どちらでも適当に選んでください。
filamentユーザー新規登録(一般ユーザー)
ユーザーを登録します。
php artisan make:filament-user
「Name」「Email address」「Password」を訊かれるので
それぞれ入力して[Enter]で確定します。
![](https://macocci7.net/blog/wp-content/uploads/2024/05/laravel11_filament_install_08.png)
※やっていることは単なるユーザー登録だけです。
※usersテーブルにレコード登録して結果表示するだけです。
管理画面ログイン
Laravelのビルトインサーバーを起動します。
php artisan serve
![](https://macocci7.net/blog/wp-content/uploads/2024/05/laravel11_filament_install_09.png)
WEBブラウザを開いて、
http://localhost:8000/
にアクセスします。
![](https://macocci7.net/blog/wp-content/uploads/2024/05/laravel11_filament_install_10.png)
まずは一般ユーザーのログイン画面からログインしてみます。
「Log in」をクリックします。
![](https://macocci7.net/blog/wp-content/uploads/2024/05/laravel11_filament_install_11.png)
先程登録したユーザーでログインしてみます。
![](https://macocci7.net/blog/wp-content/uploads/2024/05/laravel11_filament_install_12.png)
ログイン成功してdashboardにリダイレクトされました。
右上のプルダウンメニューから「Log Out」を選択します。
![](https://macocci7.net/blog/wp-content/uploads/2024/05/laravel11_filament_install_13.png)
管理者ログイン画面にアクセスします。
http://localhost:8000/admin/login
![](https://macocci7.net/blog/wp-content/uploads/2024/05/laravel11_filament_install_14.png)
先程のユーザーでログイン(Sign in)します
![](https://macocci7.net/blog/wp-content/uploads/2024/05/laravel11_filament_install_15.png)
管理画面が表示されました。
設定変更
一応、filamentのインストールと動作確認はできました。
が、一般ユーザーでも管理画面へログインできる状態です。
管理者権限を付与したユーザーのみがログインできるように
設定を変更していきます。
まずは、filamentの設定ファイルをpublishします。
php artisan vendor:publish --tag=filament-config
![](https://macocci7.net/blog/wp-content/uploads/2024/05/laravel11_filament_install_16.png)
config/filament.php に次の行を追記します。
'id' => 'admin',
![](https://macocci7.net/blog/wp-content/uploads/2024/05/laravel11_filament_install_17.png)
インストール時に設定した「ID」が、
filamentのコードでハードコーディングされているので、
ここで設定してメンテナンス性を向上させます。
filamentのインストールで追加されるvendor以外のファイルは
app/Providers/Filament/AdminPanelProvider.php
だけです。このファイルを編集します。
▼編集前
return $panel
->default()
->id('admin')
->path('admin')
->login()
->colors([
'primary' => Color::Amber,
])
▼編集後
return $panel
->default()
->id(config('filament.id'))
->path(config('filament.id'))
->login()
->colors([
'primary' => Color::Amber,
])
これで、「config/filament.php」の「id」の値を変更するだけで
管理画面のURLを変更できます。
「id」の値は「config(‘filament.id’)」で参照できます。
マイグレーション
多重認証の方法はいくつかありますが、今回は単純に
usersテーブルに「admin」フラグのカラムを追加します。
「admin」の値が1なら管理者権限あり、0なら管理者権限なしです。
「database/migrations/0001_01_01_000000_create_users_table.php」
を編集します。
次の行を追記します。
$table->tinyInteger('admin')->default(0);
![](https://macocci7.net/blog/wp-content/uploads/2024/05/laravel11_filament_install_18.png)
マイグレーションを実行します。
※データベースを作り直します。ユーザーデータは消えます。
php artisan migrate:fresh
![](https://macocci7.net/blog/wp-content/uploads/2024/05/laravel11_filament_install_19.png)
Userモデル編集
「app/Models/User.php」を編集します。
▼宣言部追記
use Filament\Models\Contracts\FilamentUser;
use Filament\Panel;
▼class宣言部に implements 追記
class User extends Authenticatable implements FilamentUser
▼「canAccessPanel」メソッド追記
public function canAccessPanel(Panel $panel): bool
{
if ($panel->getId() === config('filament.id')) {
return (bool) $this->admin;
}
return true;
}
▼完成形
<?php
namespace App\Models;
use Filament\Models\Contracts\FilamentUser;
use Filament\Panel;
// use Illuminate\Contracts\Auth\MustVerifyEmail;
use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Foundation\Auth\User as Authenticatable;
use Illuminate\Notifications\Notifiable;
class User extends Authenticatable implements FilamentUser
{
use HasFactory, Notifiable;
/**
* The attributes that are mass assignable.
*
* @var array<int, string>
*/
protected $fillable = [
'name',
'email',
'password',
];
/**
* The attributes that should be hidden for serialization.
*
* @var array<int, string>
*/
protected $hidden = [
'password',
'remember_token',
];
/**
* Get the attributes that should be cast.
*
* @return array<string, string>
*/
protected function casts(): array
{
return [
'email_verified_at' => 'datetime',
'password' => 'hashed',
];
}
public function canAccessPanel(Panel $panel): bool
{
if ($panel->getId() === config('filament.id')) {
return (bool) $this->admin;
}
return true;
}
}
「canAccessPanel()」メソッド内でアクセス権限判定を記述できます。
「$panel->getId()」が「admin」のときには、
「$user->admin」が「1」のときだけアクセスできるようにします。
Artisanコマンド作成
管理者権限を付与するためのArtisanコマンドを作成します。
「make:filament-user」コマンドをラッピングしていきます。
php artisan make:command MakeAdminUser
![](https://macocci7.net/blog/wp-content/uploads/2024/05/laravel11_filament_install_20.png)
「app/Console/Commands/MakeAdminUser.php」
を編集します。
<?php
namespace App\Console\Commands;
use App\Models\User;
use Illuminate\Console\Command;
use Illuminate\Support\Facades\Artisan;
use Illuminate\Validation\Rules\Password;
use function Laravel\Prompts\form;
class MakeAdminUser extends Command
{
/**
* The name and signature of the console command.
*
* @var string
*/
protected $signature = 'make:admin-user';
/**
* The console command description.
*
* @var string
*/
protected $description = 'Create a new admin user.';
/**
* Execute the console command.
*/
public function handle()
{
// 入力:name, email, password
list($name, $email, $password) = form()
->text(
label: 'ユーザー名を入力してください。',
placeholder: '比良 面斗',
validate: ['name' => 'required|max:255,'],
)
->text(
label: 'メールアドレスを入力してください。',
placeholder: 'hoge@example.com',
validate: ['email' => 'required|email:rfc,dns|unique:users,email'],
)
->password(
label: 'パスワードを入力してください。',
placeholder: 'Pass_w0rd',
hint: '8~16文字、大文字、小文字、数字、記号混在。',
validate: ['password' => [
'required',
Password::min(8)
->max(16)
->mixedCase()
->numbers()
->symbols()
]],
)
->submit();
// ユーザー作成
$exitCode = Artisan::call(
"make:filament-user",
[
'--name' => $name,
'--email' => $email,
'--password' => $password,
]
);
// 結果確認
if ($exitCode) {
echo "❌ユーザー作成に失敗しました。" . PHP_EOL;
exit(1);
}
// 管理権限付与
$user = User::where('email', $email)->first();
if (!$user) {
echo "❌ユーザー情報の取得に失敗しました。" . PHP_EOL;
exit(1);
}
$user->admin = 1;
$updated = $user->save();
if (!$updated) {
echo "❌ユーザー {$name} への管理者権限付与に失敗しました。" . PHP_EOL;
exit(1);
}
echo "🎉管理者ユーザーの作成が完了しました。" . PHP_EOL;
$adminUrl = env('APP_URL') . '/' . config('filament.id');
echo $user->email . ' は ' . $adminUrl . ' からログインできます。🌈' . PHP_EOL;
}
}
入力された「name」「email」「password」で
「make:filament-user」を実行し、
「email」で作成されたユーザーレコードを検索・取得、
取得できたら「admin」に「1」を保存します。
※バリデーションルールを厳し目にしています。
※emailはDNSチェックまでしています。
※不要なら「,dns」を削除してください。
※passwordは
- 「->mixedCase()」大文字小文字それぞれ最低1文字
- 「->numbers()」数字最低1文字
- 「->symbols()」記号最低1文字
となっています。不要ならそれぞれ削除してください。
管理者権限ユーザー作成
上記で作成したArtisanコマンドで管理者権限ユーザーを作成します。
php artisan make:admin-user
![](https://macocci7.net/blog/wp-content/uploads/2024/05/laravel11_filament_install_21.png)
一応、DBも確認してみます。
![](https://macocci7.net/blog/wp-content/uploads/2024/05/laravel11_filament_install_22.png)
「admin」フラグに「1」が登録されています。
管理画面ログイン
上記で作成した管理者ユーザーで管理画面にログインしてみます。
![](https://macocci7.net/blog/wp-content/uploads/2024/05/laravel11_filament_install_23.png)
管理画面にログインできました。
![](https://macocci7.net/blog/wp-content/uploads/2024/05/laravel11_filament_install_24.png)
ログインセッションは一般ユーザーと同じなので、
このまま一般ユーザー用の「Dashboard」にもアクセスできます。
![](https://macocci7.net/blog/wp-content/uploads/2024/05/laravel11_filament_install_25.png)
一旦ログアウトし、
今度は一般ユーザーでは管理画面にログインできないことを確認します。
トップページ右上の「Register」から新規登録画面へ移動します。
![](https://macocci7.net/blog/wp-content/uploads/2024/05/laravel11_filament_install_10-1.png)
適当に入力して「REGISTER」ボタンをクリックします。
![](https://macocci7.net/blog/wp-content/uploads/2024/05/laravel11_filament_install_26.png)
ユーザーを作成したら、管理者画面へアクセスします。
![](https://macocci7.net/blog/wp-content/uploads/2024/05/laravel11_filament_install_27.png)
「403 FORBIDDEN」でアクセス拒否されます。
ログアウトした状態からアクセスすると、
ログインできません。
![](https://macocci7.net/blog/wp-content/uploads/2024/05/laravel11_filament_install_28.png)
以上で、要件通りの実装ができました。
日本語化設定については次の記事をご覧ください。
また、filamentの各機能を活用して簡易システムを構築するテュートリアルの実践記録もあります。
コメント