ACUL の画面開発には、主に 2 つの方法があります。ローカル開発と、ライブテナントでの連携テストです。
Auth0 CLI の auth0 acul dev コマンドを使って、ACUL の画面をローカルでカスタマイズできます。Universal Login Context Inspector を使えば、遅延やバックエンドの依存関係なしに、ACUL の画面をすばやく繰り返し調整できます。
Universal Login Context Inspector は、テナント固有の設定に合わせて認証画面をテストするためのモックコンテキストデータを提供します。
- 画面 を選択すると、利用可能な ACUL 設定済み画面をデフォルトのモックコンテキストデータ付きで確認できます。
- データソース を選択すると、Auth0 CDN から配信されるモックコンテキストデータ、または Local Development プロジェクトの
public/screens/{prompt}/{screen} ディレクトリ内のモックコンテキストデータを選択できます。
- Download JSON アイコンを選択すると、選択した画面のコンテキストデータをダウンロードできます。
Auth0 CLI コマンド auth0 acul dev --connected を使用してライブテナント連携を行うと、カスタム画面 UI のエンドツーエンドテストを実施し、Auth0 テナントとの連携を検証できます。
リロードするたびに認証フローが再開されるため、--connected モードは UI がほぼ完成した段階での連携テストに使用してください。
auth0 acul dev --connected を使用する場合
- ACUL プロジェクトのディレクトリを選択します。
npm run build を選択して、プロジェクトをビルドし、Auth0 テナントを設定します。- ローカルのアセットを配信する ポート を選択します。デフォルトは
55444 で、ローカルサーバーはバックグラウンドで起動します。
- 必要に応じて、
--connected モードでプロジェクトの /dist/assets ディレクトリへの変更を継続的に監視できます。
新しいターミナルを開き、auth0 test login を実行して、テナント上のログインフローをテストします。
--connected モードでは、Auth0 CLI コマンドがファイルの変更を監視し、アセットを再ビルドして、テナントの設定を自動的に更新します。
認証
ユーザー管理
カスタマイズ
プラットフォーム