Kurzanleitung: Nutzer mit E-Mail-Adresse und Passwort anmelden

In dieser Kurzanleitung erfahren Sie, wie Sie mit Identity Platform einen Nutzer mit einer E-Mail-Adresse und einem Passwort anmelden.

Vorbereitung

  1. Melden Sie sich bei Ihrem Google-Konto an.

    Wenn Sie noch kein Konto haben, melden Sie sich hier für ein neues Konto an.

  2. Wählen Sie in der Google Cloud Console auf der Seite der Projektauswahl ein Google Cloud-Projekt aus oder erstellen Sie eines.

    Zur Projektauswahl

  3. Die Abrechnung für das Cloud-Projekt muss aktiviert sein. So prüfen Sie, ob die Abrechnung für Ihr Projekt aktiviert ist.

Identity Platform aktivieren

  1. Rufen Sie in der Cloud Console die Seite Identity Platform Marketplace auf.

    Zur Seite "Identity Platform Marketplace"

  2. Klicken Sie auf Identity Platform aktivieren. In der Cloud Console wird dann die Seite "Identity Platform" angezeigt.

E-Mail-Anmeldung konfigurieren

  1. Rufen Sie in der Cloud Console die Seite Identitätsanbieter auf.

    Zur Seite "Identitätsanbieter"

  2. Klicken Sie auf Anbieter hinzufügen.

  3. Wählen Sie E-Mail/Passwort aus der Liste der Anbieter und Föderationsstandards für Unternehmen aus.

  4. Ändern Sie den Schalter Aktiviert zu Ein.

  5. Klicken Sie auf Speichern.

Nutzer erstellen

  1. Rufen Sie in der Cloud Console die Seite Nutzer auf.

    Zur Seite "Nutzer"

  2. Klicken Sie auf Add User (Nutzer hinzufügen).

  3. Geben Sie eine E-Mail-Adresse und ein Passwort ein.

  4. Klicken Sie auf Speichern. Der neue Nutzer wird in der Nutzerliste angezeigt.

Nutzer anmelden

  1. Erstellen Sie eine neue Datei mit dem Namen index.html.

  2. Fügen Sie zwei einfache HTML-Container hinzu:

    <div>Identity Platform Quickstart</div>
    <div id="message">Loading...</div>
    
  3. Initialisieren Sie das Identity Platform Client SDK mit Ihrem API-Schlüssel:

    1. Rufen Sie in der Cloud Console die Seite Identitätsanbieter auf.

      Zur Seite "Identitätsanbieter"

    2. Klicken Sie auf Details zur Einrichtung der Anwendung.

    3. Kopieren Sie den Initialisierungscode in index.html. Er sollte etwa folgendermaßen aussehen:

      <script src="https://www.gstatic.com/firebasejs/8.1.1/firebase.js"></script>
      <script>
        // Initialize Identity Platform
        var config = {
          apiKey: "abcdefg123456",
          authDomain: "myproject.firebaseapp.com"
        };
        firebase.initializeApp(config);
      </script>
      
  4. Melden Sie den Nutzer an, indem Sie signInWithEmailAndPassword() aufrufen und das Ergebnis mit dem Callback onAuthStateChanged() verarbeiten. Ersetzen Sie im folgenden Beispiel email und password durch die Werte für den Nutzer, den Sie zuvor erstellt haben:

    <script>
      var email = "example@gmail.com";
      var password = "hunter2";
    
      firebase.auth().onAuthStateChanged(function(user) {
        if (user) {
          document.getElementById("message").innerHTML = "Welcome, " + user.email;
        } else {
          document.getElementById("message").innerHTML = "No user signed in.";
        }
      });
    
      firebase.auth().signInWithEmailAndPassword(email, password).catch(function(error) {
        document.getElementById("message").innerHTML = error.message;
      });
    </script>
    
  5. Starten Sie index.html in Ihrem Webbrowser. Daraufhin wird eine Willkommensnachricht mit der E-Mail-Adresse des Nutzers angezeigt.

Glückwunsch! Sie haben Ihren ersten Nutzer mit Identity Platform angemeldet.

Nächste Schritte

In einer echten Anwendung würden sich Ihre Nutzer über eine eigene Registrierungsseite registrieren und sich mit ihrer E-Mail-Adresse und einem Passwort anmelden. Identity Platform bietet eine vordefinierte UI für die Authentifizierung, die Sie für diese Seiten verwenden können. Sie können auch eine eigene Authentifizierung erstellen. Möglicherweise möchten Sie auch zusätzliche Anmeldemethoden wie soziale Anbieter (Facebook oder Google), Telefonnummern, OIDC oder SAML unterstützen.

Weitere Informationen: