【laravel】Fortifyでログインを作成する
初書:2021/2/11
PC:macOS 10.15.7
php 7.4.14
laravel 8.21.0
接続用リンク:素のPHPしか触ってなかった人がlaravelを触ってみる - Qiita
前書き
前回、laravel8で新しく出たjetstreamを使用してログインを作成してみたものの、カスタマイズ性が微妙だったのと、プロフィールを更新すると、データベースの自身の列がほぼ全部クライアント側にいくというよく分からない仕様があり、どうせなら元となるFortifyでやり直そうということで作成し直し。
目標
・ユーザーIDとパスワードでログインできる
・新規登録画面とログイン画面の作成
ちなみに、Fortifyの説明書はこちら
一度は読むことをおすすめする。
インストール
とりあえず最低限実行するやつとセットで。
% composer require laravel/fortify
% php artisan vendor:publish --provider="Laravel\Fortify\FortifyServiceProvider"
これでトップページにアクセスしたとき、右上に「Login」と「Register」が増えていればインストール出来ていると思われる
初期設定の変更
jetstreamと異なり、Fortify単体で使う場合は初期設定が必要になるので、その辺を変更する。
あとついでに、今回はemailではなくuseridでログインを試みるため、それも変更していく。
'providers' => [
// 略
App\Providers\EventServiceProvider::class,
App\Providers\RouteServiceProvider::class,
+ App\Providers\FortifyServiceProvider::class
],
public function boot()
{
+ Fortify::loginView(fn () => view('login'));
+ Fortify::registerView(fn () => view('register'));
Fortify::createUsersUsing(CreateNewUser::class);
Fortify::updateUserProfileInformationUsing(UpdateUserProfileInformation::class);
// 略
}
- 'username' => 'email',
+ 'username' => 'userid',
'email' => 'email',
protected $fillable = [
'name',
- 'email',
+ 'userid',
'password',
];
データベースを変更
今回はメールアドレスとパスワードではなく、ユーザーIDとパスワードでログインするため、通常のデータベースではうまくログインできない。
そのため、作成されるデータベースを変更する必要がある。
database/migrations/XXXX_XX_XX_XXXXXX_create_users_table.php
を変更する。(Xには日付が入っている)
public function up()
{
Schema::create('users', function (Blueprint $table) {
$table->id();
$table->string('name');
- $table->string('email')->unique();
+ $table->string('userid')->unique();
+ $table->string('email')->unique()->nullable();
$table->timestamp('email_verified_at')->nullable();
$table->string('password');
$table->rememberToken();
$table->timestamps();
});
}
変えるのは2箇所、useridというユニーク列を増やし、emailをnullableに変更する。(もしくはemail行を削除してもいい。)
変更できたらデータベースを作成する
% php artisan migrate
ログインフォームを作成する
準備ができたのでログイン画面を作成する。
Fortify単体ではクライアント方面の補助は特にないので、自身でレイアウトを作成する。
今回は単純なものを用意する
まず、resources/views/login.blade.php
ファイルを作成する。
<h1>ログイン</h1>
@if ($errors->any()) {{-- 1 --}}
<div class="login_error">
<ul>
@foreach ($errors->all() as $error)
<li>{{ $error }}</li>
@endforeach
</ul>
</div>
@endif {{-- 1 --}}
<form method="POST" class="form" action="{{ url()->current() }}"> {{-- 2 --}}
@csrf {{-- 3 --}}
<input type="text" name="userid" placeholder="user id" value="{{ old('userid') }}" required autofocus>
<input type="password" name="password" placeholder="Password" required>
<button type="submit" id="login-button">Login</button>
</form>
一応簡単に説明すると、{{-- --}}
がbladeのコメントアウト。
1のところは、ログインに失敗した時にエラーを出力するため
2のところは、formの作成。{{ url()->current() }}
は現在のurlを返す。
3のところは、csrfトークン。詳しくはこちら
あとは普通にログインフォーム。
これでとりあえずログインを試みることはできる。データがないのでログインに成功することは無いが。
新規登録フォームを作成する
先に新規登録画面を作成するべきな気がするが、そこは気にしない。
こちらもクライアント方面は自作する必要がある。
その前に変更する箇所があるので、ここを変更する
public function create(array $input)
{
Validator::make($input, [
'name' => ['required', 'string', 'max:255'],
- 'email' => [
+ 'userid' => [
'required',
'string',
- 'email',
+ 'min:6',
'max:255',
Rule::unique(User::class),
],
'password' => $this->passwordRules(),
])->validate();
return User::create([
'name' => $input['name'],
- 'email' => $input['email'],
+ 'userid' => $input['userid'],
'password' => Hash::make($input['password']),
]);
}
新規登録する際にメールアドレスからユーザーIDに変更している。
ユーザーIDの文字数は6~255にしているが、システムによって変更する。
変更したら、resources/views/register.blade.php
ファイルを作成する。
<h1>新規登録</h1>
@if ($errors->any())
<div class="login_error">
<ul>
@foreach ($errors->all() as $error)
<li>{{ $error }}</li>
@endforeach
</ul>
</div>
@endif
<form method="POST" class="form" action="{{ url()->current() }}">
@csrf
<input type="text" name="name" placeholder="name" value="{{ old('name') }}" required autofocus>
<input type="text" name="userid" placeholder="user id" value="{{ old('userid') }}" required autofocus>
<input type="password" name="password" placeholder="Password" required>
<input type="password" name="password_confirmation" placeholder="Password(confirmation)" required>
<button type="submit" id="login-button">新規登録</button>
</form>
ログインフォームとの違いは、name
とpassword_confirmation
が追加された点。
それ以外はほとんど変わっていない。
終わりに
ページを作成する以外はほとんどjetstreamと変わらないと思う。
日本語作成などは同じなので、前回を参考にしたり、他のページを参考にしたりして欲しい。
Discussion