Wie konfiguriere ich die gehostete Web-Benutzeroberfläche für Amazon Cognito?

Kurzbeschreibung

Wenn Sie in Amazon Cognito einen Benutzerpool erstellen und dann eine Domain dafür konfigurieren, stellt Amazon Cognito automatisch eine gehostete Web-Benutzeroberfläche bereit, über die Sie Ihrer App-Registrierungs- und Anmeldeseiten hinzufügen können.

Wenn Sie sich nicht sicher sind, wie Sie das einrichten oder welche Einstellungen Sie verwenden sollen, z. B. welche Arten von OAuth 2.0-Flows und -Bereichen aktiviert werden sollen, folgen Sie den Schritten in diesem Artikel.

Behebung

Falls Sie dies noch nicht getan haben, erstellen Sie einen Benutzerpool und erstellen Sie einen App Client im Benutzerpool. Folgen Sie dann diesen Anweisungen:

Hinweis: Diese Anweisungen verwenden die neue Amazon-Cognito-Konsole.

Ihrem Benutzerpool einen Domain-Namen hinzufügen

1. Wählen Sie in der Amazon-Cognito-Konsole Benutzerpools und dann Ihren Benutzerpool aus.
2. Wählen Sie unter App Integration die Option Domain-Name und dann Aktionen aus.
3. Wählen Sie Cognito Domain erstellen aus, um der von Amazon Cognito gehosteten Domain Ihr eigenes Domain-Präfix hinzuzufügen. Oder wählen Sie Benutzerdefinierte Domain erstellen aus, um Ihre eigene benutzerdefinierte Domain hinzuzufügen.

App-Client-Einstellungen ändern

1. Wählen Sie in der Amazon-Cognito-Konsole Benutzerpools und dann Ihren Benutzerpool aus.
2. Wählen Sie unter App Integration im Bereich App Clients und Analysen Ihren App Client aus.
3. Wählen Sie im Bereich Gehostete Benutzeroberfläche die Option Bearbeiten aus.
4. Gehen Sie wie folgt vor:
   Geben Sie unter Zulässige Callback URLs die URL Ihrer Webanwendung ein, die den Autorisierungscode erhalten soll. Ihre Benutzer werden hierher weitergeleitet, wenn sie sich anmelden.
   Geben Sie unter Zulässige Abmelde-URLs – optional die URL ein, an die Sie Ihre Benutzer weiterleiten möchten, wenn sie sich abmelden.
   Wählen Sie für Identitätsanbieter den Cognito-Benutzerpool aus der Dropdown-Liste aus.
   Wählen Sie für OAuth 2.0-Gewährungstypen entweder Authorization Code-Gewährung oder implizite Gewährung von OAuth 2.0 Authentication Flow. Der Gewährungstyp Autorisierungscode wird von vertraulichen und öffentlichen Clients verwendet, um einen Autorisierungscode gegen ein Zugriffstoken zu tauschen. Der implizite Gewährungstyp wird nur verwendet, wenn es einen bestimmten Grund gibt, warum die Gewährung der Autorisierungscode nicht verwendet werden kann.
   Wählen Sie für OpenID-Connect-Bereiche openid und alle anderen OAuth-Bereiche aus, für die Amazon Cognito die Token für die Authentifizierung Ihrer Benutzer hinzufügen soll. Zum Beispiel Telefon und E-Mail.
   Wählen Sie unter Benutzerdefinierte Bereiche alle benutzerdefinierten Bereiche aus, die Sie für diese App autorisieren möchten.
5. Wählen Sie Änderungen speichern aus.

Weitere Informationen finden Sie unter Konfiguration eines Benutzerpool-App-Clients.

(Optional) Anpassen der gehosteten Web-Benutzeroberfläche

Sie können ein benutzerdefiniertes Logo hinzufügen oder das CSS für die gehostete Web-Benutzeroberfläche anpassen. Weitere Informationen finden Sie unter Anpassen der integrierten Anmelde- und Registrierungswebseiten.

(Optional) Konstruieren der URL für die gehostete Web-Benutzeroberfläche

Wenn Sie kontrollieren möchten, welche Parameter in der Anmelde-URL für die gehostete Web-Benutzeroberfläche enthalten sind, erstellen Sie die URL manuell.

1. Wählen Sie in der Amazon-Cognito-Konsole Benutzerpools und dann Ihren Benutzerpool aus.
2. Kopieren Sie unter App Integration die Domain URL im Abschnitt Domain. Fügen Sie dann die URL zur späteren Verwendung in einen Texteditor ein.
3. Klicken Sie unter App Clients und Analytics auf den Namen Ihres Clients.
4. Kopieren Sie die Client ID in Ihre Zwischenablage. Fügen Sie dann die ID zur späteren Verwendung in einen Texteditor ein.
5. Kopieren Sie eine der zulässigen Callback URLs in die Zwischenablage. Fügen Sie dann die URL zur späteren Verwendung in einen Texteditor ein.
6. Erstellen Sie die URL für die gehostete Web-Benutzeroberfläche, indem Sie die Informationen, die Sie gerade kopiert haben, in dieses Format einfügen:
   domainUrl/login?response_type=code&client_id=appClientId&redirect_uri=callbackUrl
   Zum Beispiel: https://my-user-pool.auth.us-east-1.amazoncognito.com/login?response_type=code&client_id=a1b2c3d4e5f6g7h8i9j0k1l2m3&redirect_uri=https://my-website.com
   -oder-
   Wählen Sie im Bereich App Client die Option Gehostete Benutzeroberfläche anzeigen, um auf die Standard-URL für den Anmeldeendpunkt zuzugreifen. Ersetzen Sie dann Teile der URL wie zuvor beschrieben.

Wenn Sie die Gewährung des Autorisierungscodes zuvor für OAuth 2.0-Gewährungstypen aktiviert haben, fordert Amazon Cognito bei Eingabe dieser URL auf, einen Autorisierungscode zurückzugeben, wenn sich Ihre Benutzer anmelden. Wenn Sie zuvor die implizite Gewährung für OAuth 2.0-Gewährungstypen aktiviert haben und Sie möchten, dass Amazon Cognito stattdessen ein Zugriffstoken zurückgibt, wenn sich Ihre Benutzer anmelden, ersetzen Sie in der URL response_type=code durch response_type=token.

Die gehostete Web-Benutzeroberfläche starten

**Hinweis:**Wenn Sie die URL für die gehostete Web-Benutzeroberfläche manuell erstellt haben, geben Sie diese URL stattdessen in Ihren Webbrowser ein.

1. Wählen Sie in der Amazon-Cognito-Konsole Benutzerpools und dann Ihren Benutzerpool aus.
2. Klicken Sie unter App Integration im Bereich App Clients und -Analyse auf Ihren Client-Namen.
3. Wählen Sie unter Gehostete Benutzeroberfläche die Option Gehostete Benutzeroberfläche anzeigen. Die Anmeldeseite der gehosteten Web-Benutzeroberfläche wird in einer neuen Browser-Registerkarte oder -Fenster geöffnet.

Ähnliche Informationen

Erste Schritte mit Benutzerpools