🎉 Nuxt Laravel FortifyおよびSanctumモジュール
このNuxtモジュールは、NuxtとLaravel FortifyおよびSanctumをSSRフレンドリーな方法でシームレスに統合し、豊富な認証機能を提供します。このモジュールを使用することで、Laravel Fortifyの機能を活用し、APIトークンとSPA Cookieベースの認証の両方を実行できます。
🚀 機能
- ユーザー登録 📋
- パスワードのリセット 🔄
- メールアドレス確認 📧
- プロフィール情報の更新 ✏️
- パスワードの更新 🔐
- 二要素認証 🔒
🛠️ インストールと設定
💡注意: Laravel Fortify、Laravel Sanctum、およびfortify-sanctumパッケージをバックエンドのLaravelアプリケーションにインストールして設定する必要があります。fortify-sanctumパッケージは、Laravel Fortifyの認証機能をLaravel Sanctumと容易に統合します。
nuxt-fortify
モジュールをNuxtプロジェクトに追加します。
npx nuxi@latest module add nuxt-fortify
💻 Nuxt設定
nuxt.config.js
にモジュールをインストールして設定することで、Nuxtプロジェクトに追加します。
// nuxt.config.js
export default {
modules: [
'nuxt-fortify',
],
nuxtFortify: {
baseUrl: 'https://127.0.0.1:3000/api',
origin: 'https://127.0.0.1:3000',
authMode: 'cookie',
authHome: '/dashboard',
endpoints: {
csrf: '/sanctum/csrf-cookie',
user: '/user',
// other endpoints...
},
features: {
registration: true,
resetPasswords: true,
twoFactorAuthentication: true,
// other features...
}
// other configurations...
}
}
📜 設定
キー | データ型 | デフォルト値 | 必須 |
---|---|---|---|
baseUrl | 文字列 | https://127.0.0.1:3000/api | はい |
authMode | 文字列 | cookie | はい |
loginRoute | エンドポイント | /login | いいえ |
authHome | エンドポイント | /home | いいえ |
cookieKey | 文字列 | XSRF-TOKEN | いいえ |
cookieHeader | 文字列 | X-XSRF-TOKEN | いいえ |
tokenStorageKey | 文字列 | API-TOKEN | いいえ |
endpoints.csrf | エンドポイント | /sanctum/csrf-cookie | いいえ |
endpoints.login | エンドポイント | /login | いいえ |
endpoints.logout | エンドポイント | /logout | いいえ |
endpoints.user | エンドポイント | /user | いいえ |
endpoints.tfa.enable | エンドポイント | /user/two-factor-authentication | いいえ |
endpoints.tfa.disable | エンドポイント | /user/two-factor-authentication | いいえ |
endpoints.tfa.code | エンドポイント | /user/two-factor-qr-code | いいえ |
endpoints.tfa.confirm | エンドポイント | /user/confirmed-two-factor-authentication | いいえ |
endpoints.tfa.recoveryCode | エンドポイント | /user/two-factor-recovery-codes | いいえ |
endpoints.tfa.challenge | エンドポイント | /two-factor-challenge | いいえ |
endpoints.register | エンドポイント | /register | いいえ |
endpoints.resetPassword | エンドポイント | /forgot-password | いいえ |
endpoints.updatePassword | エンドポイント | /reset-password | いいえ |
endpoints.confirmPassword | エンドポイント | /user/confirm-password | いいえ |
endpoints.resendEmailVerificationLink | エンドポイント | /email/verification-notification | いいえ |
intendedRedirect | ブール値 | true | いいえ |
features.registration | ブール値 | true | いいえ |
features.resetPasswords | ブール値 | true | いいえ |
features.emailVerification | ブール値 | true | いいえ |
features.updateProfileInformation | ブール値 | true | いいえ |
features.updatePasswords | ブール値 | true | いいえ |
features.twoFactorAuthentication | ブール値 | true | いいえ |
tfaRoute | エンドポイント | /two-factor-authentication | いいえ |
logLevel | 数値 | 1 | いいえ |
origin | 文字列 | https://127.0.0.1:3000 | はい |
🌐 エンドポイント設定
エンドポイントキー | パス | リクエストメソッド |
---|---|---|
csrf | /sanctum/csrf-cookie | POST |
login | /login | POST |
logout | /logout | POST |
user | /user | POST |
tfa.enable | /user/two-factor-authentication | POST |
tfa.disable | /user/two-factor-authentication | DELETE |
tfa.code | /user/two-factor-qr-code | GET |
tfa.confirm | /user/confirmed-two-factor-authentication | POST |
tfa.recoveryCode | /user/two-factor-recovery-codes | GET |
tfa.challenge | /two-factor-challenge | POST |
register | /register | POST |
resetPassword | /forgot-password | POST |
updatePassword | /reset-password | POST |
confirmPassword | /user/confirm-password | POST |
resendEmailVerificationLink | /email/verification-notification | POST |
これらの手順と設定に従うことで、Laravel FortifyとSanctumを完全に統合したNuxtアプリケーションを構築し、堅牢な認証ソリューションを実現できます。🚀
🤝 コントリビューション
このモジュールを強化するためのコントリビューションを歓迎します。コントリビューションの手順は以下のとおりです。
- リポジトリのフォーク:GitHubでこのリポジトリをフォークします。
- フォークのクローン:フォークしたリポジトリをローカルマシンにクローンします。
git clone https://github.com/dev-charles15531/nuxt-forify.git cd nuxt-fortify
- ブランチの作成:機能追加やバグ修正のための新しいブランチを作成します。
git checkout -b feature-or-bugfix-name
- 変更の実施:機能を追加またはバグを修正します。コードがプロジェクトのコーディング規約に従っており、すべてのテストに合格していることを確認してください。
- 変更のコミット:明確で簡潔なコミットメッセージで変更をコミットします。
git add . git commit -m "Description of the feature or fix"
- フォークへのプッシュ:変更をフォークしたリポジトリにプッシュします。
git push origin feature-or-bugfix-name
- プルリクエストの送信:メインリポジトリにプルリクエストを送信します。変更内容と、対処する問題または機能を明確に説明してください。
📝 ガイドライン
- プロジェクトで使用されているコーディングスタイルに従ってください。
- 明確で簡潔なコミットメッセージを書いてください。
- コードがすべてのテストに合格し、新しい問題が発生していないことを確認してください。
- 変更によってモジュールの使用方法または設定方法が影響を受ける場合は、ドキュメントを更新してください。
📧 お問い合わせ
ご質問やヘルプが必要な場合は、お気軽にissueを作成するか、このリポジトリのメンテナーにお問い合わせください。
コントリビューションありがとうございます!皆様のご尽力に感謝いたします。🙌