メインコンテンツへスキップ
ACUL画面の開発には、ローカル開発とライブテナント統合テストという2つの主なモードがあります。

ローカル開発

Auth0 CLIコマンドのauth0 acul devを使用して、ACUL画面をローカルでカスタマイズできます。ユニバーサルログインコンテキストインスペクターを使用すれば、遅延やバックエンドへの依存なしに、ACUL画面を高速に反復処理できます。 ユニバーサルログインコンテキストインスペクターは、テナント固有の構成に対して認証画面をテストするためのモックコンテキストデータを提供します。
Universal Login Context Inspector
  • **[画面]**を選択すると、利用可能なACUL構成済み画面とデフォルトのモックコンテキストデータが表示されます。
  • [データソース]を選択すると、Auth0 CDNから提供されるモックコンテキストデータ、またはローカル開発プロジェクトのpublic/screens/{prompt}/{screen} ディレクトリにあるモックコンテキストデータを選択できます。
  • **[JSONをダウンロード]**アイコンを選択すると、選択した画面のコンテキストデータをダウンロードできます。

ライブテナント統合テスト

Auth0 CLIコマンドのauth0 acul dev --connectedを使用したライブテナント統合によって、カスタム画面UIをエンドツーエンドでテストし、Auth0テナントとの統合を検証できます。 リロードごとに認証フローが再開されるため、UIがほぼ完成した後は、統合テストには--connectedモードを使用してください。 auth0 acul dev --connectedを使用する場合
  • ACULプロジェクトのディレクトリを選択します。
  • npm run buildを選択してプロジェクトをビルドし、Auth0テナントを構成します。
  • ローカルアセットを提供するポート(デフォルトでは 55444)を選択し、ローカルサーバーをバックグラウンドで起動します。
  • 任意で--connectedモードを許可し、プロジェクトの /dist/assetsディレクトリへの変更を継続的に監視します。
新しいターミナルを開き、auth0 test loginを実行してテナントのログインフローをテストします。
--connectedモードでは、Auth0 CLIコマンドはファイルの変更を監視し、アセットを再構築し、テナントの構成を自動的に更新します。
詳しくは、GitHubの「[Auth0 CLI]」(https://auth0.github.io/auth0-cli/auth0_acul_dev.html)をご覧ください。