Skip to main content
Auth0のは、の中核機能であるログインフローを提供します。ユーザーがアプリケーションにアクセスするために本人確認を行う必要がある場合は、Universal Login にリダイレクトするだけで、認証プロセスは Auth0 に任せることができます。 Universal Login では、さまざまな認証方式に対応するための追加の実装作業は必要ありません。まずはシンプルな認証フローから始めて、パスワードレスログイン、ソーシャルログイン、または (MFA) などの機能を追加することで、安全で使いやすいログイン体験にカスタマイズできます。 Universal Login の設定は動的に行えるため、アプリケーションレベルでの変更は必要ありません。これは、Auth0 の一元管理されたでホストされる Web ページが、ログインフロー全体を担うためです。さらに、Auth0 が Universal Login に加えた改善をアプリケーションで利用するために、コードを手動で更新する必要もありません。 では、ログインページの外観や動作をカスタマイズして、一貫性のあるブランド体験を実現できます。より高度なユースケースでは、各ページのコードを個別に変更することもできます。 Universal Login と埋め込みログインの違いについて詳しくは、Centralized Universal Login vs. Embedded Loginを参照してください。

​
Universal Login を設定する

Auth0 Dashboard では、Branding > Universal Login > Advanced Options で、デフォルトのログインページに使用するエクスペリエンスを選択できます。 Auth0 では、ホスト型のログインエクスペリエンスを 2 つ提供しています。
  • Universal Login は、ユーザーにシンプルなエクスペリエンスを提供し、カスタマイズのために JavaScript を使用する必要がありません。
  • Classic Login は、ログインフローの各ページで JavaScript コントロールを使用します。
現在、Auth0 の開発は Universal Login に注力されており、Classic Login には新たな更新は行われていません。特定のユースケースで Classic エクスペリエンスが必要な場合を除き、Universal Login の実装を推奨します。 この 2 つのエクスペリエンスの違いについて詳しくは、Universal Login と Classic Login の比較 を参照してください。

​
アクセシビリティ

Auth0 は、支援技術を利用するユーザーが Universal Login フローを使いやすくなるよう、次の標準に準拠しています。 Auth0 Universal Login では、これらの標準への対応がデフォルトで有効になっています。以下は、お客様によるカスタマイズに影響する可能性がある項目です。
  • 検証エラーは、スクリーンリーダーで読み取れるよう、ツールチップではなくインラインで表示されます。
  • デフォルトのインターフェースコンポーネントの色は、色のコントラストに関する WCAG ガイドラインに準拠しています。
  • フォームではオートコレクトが使用されます。
  • インターフェースコンポーネントの ARIA やその他の属性により、スクリーンリーダーで簡単に操作できます。
  • メールアドレスはクライアント側で検証され、サーバー側の検証と同じ書式ルールに従います。
  • HTML ラベルはアクセシブルで、それぞれ対応する入力フィールドに関連付けられています。
  • パスワードの複雑さの要件とインラインエラーメッセージは、スクリーンリーダーによって読み上げられます。
  • すべての 画面には、わかりやすく固有のページタイトルが設定されています。
  • 必須フィールドのラベルには、視覚的なインジケーターが表示されます。

​
ログインページをカスタマイズする

Universal Login を有効にすると、Auth0 Dashboard からログインページを直接カスタマイズできます。具体的には、ページテンプレートやテーマ、サインアップやログインのプロンプト、その他のテキスト要素をカスタマイズできます。詳しくは、Customize Universal Login を参照してください。 Classic Login を実装する場合は、Auth0 Dashboard から基本的なブランディングオプションをカスタマイズできます。その後、ログインフローの構築に使用する SDK を使って、より高度なカスタマイズを設定できます。詳しくは、Customize Classic Login を参照してください。

​
Universal Login を実装する

テナント内で Universal Login または Classic Login のいずれかを有効にしたら、以下の手順に従ってこのエクスペリエンスを実装します。
  1. Auth0 にアプリケーションを登録します。
  2. ログインフローを開始してレスポンスを処理できるように、アプリケーションから Authentication API の ログイン エンドポイント を呼び出すよう設定します。これは直接設定することも、Auth0 の SDK のいずれかを使用することもできます。
  3. Database、Enterprise、または Social 接続を作成し、アプリケーションで有効にします。

​
ログインページを開く

どのブラウザーからでも、ログイン エンドポイント を直接呼び出すことができます。 リクエストには、次の値を含める必要があります。 必要に応じて、connection パラメーターを指定すると、ユーザーにそのコネクションでの認証を促すことができます。

​
Correlation ID

Universal Login は、すべての認証フローで Correlated Events をサポートしています。Universal Login を実装すると、アプリケーションで一意の ID が生成され、その ID を correlation_id として /authorize エンドポイントに渡します。この一意の ID は、次の認証イベント全体で引き継がれます。
  • サインアップ
  • ログイン
  • 多要素認証 (MFA) の登録とチャレンジ
  • パスワードのリセット
correlation_id を渡すと、Auth0 ログ で認証イベントを追跡できます。 詳細については、Correlation ID を参照してください。

​
Quickstart ガイドを活用する

アプリケーションに Universal Login を設定する方法について詳しくは、Quickstart ガイドをご覧ください。ご利用の技術に最も適した方法を選び、Quickstart に沿って実装手順を確認してください。