2020年9月8日にLaravelのバージョン8がリリースされたようですね。
またユーザー認証の構築がまた変わり、jetstreamというライブラリを導入するようになったので、今回もバージョン6と同様にログイン認証を作っていき、少しだけ動きを見ていきたいと思います。
Laravelのリリースとサポート
Laravelのサポートですが、下記のようになっているようです。
Security Fixesはちょうど一年のようですね。
バージョン8は2020年9月8日リリースなっていますが、日本時間だとちょっとズレがあるのかな。
Version | Release | Bug Fixes Until | Security Fixes Until |
---|---|---|---|
6 (LTS) | September 3rd, 2019 | September 3rd, 2021 | September 3rd, 2022 |
7 | March 3rd, 2020 | September 10th, 2020 | March 3rd, 2021 |
8 | September 8th, 2020 | March 8th, 2021 | September 8th, 2021 |
Laravelのインストール
インストールの手順は変わらないようなので、今回はcomposerでインストールします。
composer create-project --prefer-dist laravel/laravel {フォルダ}
インストールが終わったら、ドキュメントルートにアクセスします。
トップページが新しくなりましたね。おそらくーダークモードなのでこの色になっているのかと。
また、User.phpがちゃんとModelsフォルダの中に入ったようです。
地味にめんどくさかったので、解消されてよかったです。
.envのDB設定
.envファイルのDBを設定します。各環境に合わせて適宜記載してください。
今回はhomesteadのMySQLを使います。
.envファイル
DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=repo-sample
DB_USERNAME=homestead
DB_PASSWORD=secret
jetstreamライブラリのインストール
Laravel8ではjetstreamというライブラリが認証周りのライブラリになるようです。
今までのログイン機能やメール認証の他に二要素認証なども組み込まれます。
composer require laravel/jetstream
laravelコマンドで下記のようにlaravelと一緒にインストールも出来るようです。
laravel new project-name --jet
インストールが完了するとartisanコマンドにjetstreamが追加されます。
jetstream
jetstream:install Install the Jetstream components and resources
jetstreamのセットアップ
今回は、livewireとinertiaの2つがあるようです。
php artisan jetstream:install livewire
または
php artisan jetstream:install inertia
詳細までは掴めていませんが、livewireはLaravel側でJSを生成し何かアクションがある度にUIコンポーネントを取ってきて、画面に出してくれるイメージでしょうか。
Installation | Livewire Screencasts | Livewire
vueやreactなどを使う場合は、inertia選択するようです。
今回はlivewireでインストールします。
DBのマイグレーション
いつも通り
php artisan migrate
npm install
いつも通り
npm install
npm run dev
画面確認
ユーザー登録
ダッシュボード
プロフィール
二要素認証
Livewire の動きを確認
Livewireの公式サイトのgoogle翻訳によると、
Livewireは、(Bladeインクルードのように)最初のコンポーネント出力をページとともにレンダリングします。 このように、それはSEOフレンドリーです。
インタラクションが発生すると、Livewireは更新されたデータを使用してサーバーにAJAXリクエストを送信します。
サーバーはコンポーネントを再レンダリングし、新しいHTMLで応答します。
次に、Livewireは、変更されたものに従ってDOMをインテリジェントに変更します。
初期表示はサーバー側のviewの結果を出力するのでSEO的には良いですよ。
動きが発生するとAJAXをリクエストしてコンポーネントを再レンダリングするということなので、ちょっと見てみます。
初期表示のAJAX確認
画面表示時は特にAJAXが呼ばれている形跡はありません。
ユーザー情報の更新を実施
ユーザー情報のNameを変更してSAVEボタンを押下すると、/livewire/message/profile.update-profile-information-form
が呼ばれHTMLがレスポンスとして返ってき更新されます。
今回はLaravel8のユーザー認証周りを触ってみましたが、バージョン8になりまた覚えることが増えてきましたね。
Livewireはサーバー側の自分にとってはなかなか面白い機能ではありますが、感じ的には今まで通り、LaravelでAPIを実装しVueやReactなりでフロントを実装する方が、アプリケーション的には保守性が高いのではないかと思います。