Freigeben über

Anmelden von Benutzern in einer Python Flask-Beispielwebanwendung

  • Artikel

In diesem Artikel erkunden Sie eine Python Flask-Webanwendung, die mit Microsoft Entra External ID geschützt wird. Dieses Beispiel führt Sie durch die Anmeldeerfahrung für Kunden, die sich bei einer Python Flask-Webanwendung authentifizieren. Die Beispielwebanwendung verwendet die Microsoft-Authentifizierungsbibliothek für Python (MSAL Python), um die Benutzerauthentifizierung zu verarbeiten.

Voraussetzungen

Registrieren der Web-App

Damit Ihre Anwendung Benutzer mit Microsoft Entra anmelden kann, muss Microsoft Entra External ID auf die von Ihnen erstellte Anwendung aufmerksam gemacht werden. Durch die App-Registrierung wird eine Vertrauensstellung zwischen der Anwendung und Microsoft Entra eingerichtet. Wenn Sie eine Anwendung registrieren, generiert External ID einen eindeutigen Bezeichner, die Anwendungs-ID (Client). Dieser Wert wird zum Identifizieren Ihrer Anwendung beim Erstellen von Authentifizierungsanforderungen verwendet.

Die folgenden Schritte veranschaulichen, wie Sie Ihre Anwendung im Microsoft Entra Admin Center registrieren:

  1. Melden Sie sich beim Microsoft Entra Admin Center mindestens mit der Rolle Anwendungsentwickler an.

  2. Wenn Sie Zugriff auf mehrere Mandanten haben, verwenden Sie das Einstellungen-Symbol im oberen Menü, um über das Menü Verzeichnisse + Abonnements zu Ihrem externen Mandanten zu wechseln.

  3. Navigieren Sie zu Identität>Anwendungen>App-Registrierungen.

  4. Wählen Sie + Neue Registrierung aus.

  5. Auf der Seite Anwendung registrieren die angezeigt wird.

    1. Geben Sie im Abschnitt Name einen aussagekräftigen Anwendungsnamen ein, der den Benutzern der Anwendung angezeigt wird (z. B. ciam-client-app).
    2. Wählen Sie unter Unterstützte Kontotypen die Option Nur Konten in diesem Organisationsverzeichnis aus.

  6. Wählen Sie Registrieren.

  7. Der Bereich Übersicht der Anwendung wird bei erfolgreicher Registrierung angezeigt. Notieren Sie sich die Anwendungs-ID (Client), die im Quellcode Ihrer Anwendung verwendet werden sollen.

Führen Sie die folgenden Schritte aus, um den Anwendungstyp für Ihre Anwendungsregistrierung anzugeben:

  1. Wählen Sie unter Verwalten die Option Authentifizierung aus
  2. Wählen Sie auf der Seite Plattformkonfigurationen die Option Plattform hinzufügen und dann die Option Web aus.
  3. Geben Sie unter Umleitungs-URLs den Wert http://localhost:3000/getAToken ein. Dieser Umleitungs-URI ist der Ort, an den der Autorisierungsserver das Zugriffstoken sendet. Sie können sie an Ihren Anwendungsfall anpassen.
  4. Wählen Sie Konfigurieren aus, um Ihre Änderungen zu speichern.

Hinzufügen eines geheimen Clientschlüssels für die Anwendung

Erstellen Sie einen geheimen Clientschlüssel für die registrierte Anwendung. Die Anwendung verwendet den geheimen Clientschlüssel beim Anfordern von Token als Identitätsnachweis.

  1. Wählen Sie auf der Seite App-Registrierungen die von Ihnen erstellte Anwendung (z. B. ciam-client-app) aus, um ihre Seite Übersicht zu öffnen.
  2. Wählen Sie unter Verwalten die Option Zertifikate und Geheimnisse aus.
  3. Wählen Sie Neuer geheimer Clientschlüssel.
  4. Geben Sie im Feld Beschreibung eine Beschreibung für das Clientgeheimnis ein (z. B. Ciam-App-Clientgeheimnis).
  5. Wählen Sie unter Gültig bis einen Gültigkeitszeitraum für den geheimen Schlüssel (gemäß den jeweiligen Sicherheitsregeln Ihrer Organisation) und dann Hinzufügen aus.
  6. Notieren Sie den Wert des Geheimnisses. Dieser Wert wird in einem späteren Schritt für die Konfiguration verwendet. Der Wert des Geheimnisses wird nicht noch mal angezeigt und kann nicht anderweitig abgerufen werden, nachdem Sie die Seite Zertifikate & Geheimnisse verlassen haben. Notieren Sie sich diesen daher unbedingt.

Nachdem Sie die Anwendung registriert haben, wird ihr die Berechtigung User.Read zugewiesen. Da der Mandant jedoch ein externer Mandant ist, können die Kundenbenutzer selbst in diese Berechtigung einwilligen. Als Administrator müssen Sie im Namen aller Benutzer im Mandanten dieser Berechtigung zustimmen:

  1. Wählen Sie auf der Seite App-Registrierungen die von Ihnen erstellte Anwendung (z. B. ciam-client-app) aus, um die Seite Übersicht zu öffnen.

  2. Wählen Sie unter Verwalten die Option API-Berechtigungen.

    1. Wählen Sie Administratorzustimmung für <Name Ihres Mandanten> erteilen und dann Ja aus.
    2. Wählen Sie Aktualisieren aus, und vergewissern Sie sich, dass für die Berechtigung unter Status der Status Erteilt für <Name Ihres Mandanten> angezeigt wird.

Erstellen eines Benutzerflows

Führen Sie die folgenden Schritte aus, um einen Benutzerflow zu erstellen, den ein Kunde zum Anmelden oder Registrieren für eine Anwendung verwenden kann.

  1. Melden Sie sich beim Microsoft Entra Admin Center mindestens mit der Rolle Administrator für Benutzerflows mit externer ID an.

  2. Wenn Sie Zugriff auf mehrere Mandanten haben, verwenden Sie das Einstellungen-Symbol im oberen Menü, um über das Menü Verzeichnisse + Abonnements zu Ihrem externen Mandanten zu wechseln.

  3. Browsen Sie zu Identität>External Identities>Benutzerflows.

  4. Wählen Sie + Neuer Benutzerflow aus.

  5. Gehen Sie auf der Seite Erstellen folgendermaßen vor:

    1. Geben Sie einen Namen für den Benutzerflow ein, z. B. SignInSignUpSample.

    2. Wählen Sie in der Liste Identitätsanbieter die Option Email-Konten aus. Dieser Identitätsanbieter bietet Benutzern die Möglichkeit, sich mit ihrer Email-Adresse anzumelden oder zu registrieren.

      Hinweis

      Weitere Identitätsanbieter werden hier nur aufgeführt, nachdem ein Verbund mit ihnen eingerichtet wurde. Wenn Sie beispielsweise einen Verbund mit Google oder Facebook einrichten, können Sie diese zusätzlichen Identitätsanbieter hier auswählen.

    3. Unter Email-Konten können Sie eine der beiden Optionen auswählen. Wählen Sie für dieses Tutorial Email mit Kennwort aus.

      • Email mit Kennwort: Ermöglicht es neuen Benutzern, sich mit einer E-Mail-Adresse als Anmeldenamen und einem Kennwort als ersten Faktor der Anmeldeinformationen zu registrieren und anzumelden.
      • Email mit Einmal-Passcode: Ermöglicht es neuen Benutzern, sich mit einer E-Mail-Adresse als Anmeldenamen und einem Einmal-Passcode als ersten Faktor der Anmeldeinformationen zu registrieren und anzumelden. Email mit Einmal-Passcode muss auf Mandantenebene (Alle Identitätsanbieter>Email mit Einmal-Passcode) aktiviert sein, damit diese Option auf Benutzerflowebene verfügbar ist.

    4. Wählen Sie unter Benutzerattribute die Attribute aus, die Sie vom Benutzer bei der Registrierung erfassen möchten. Wenn Sie Mehr anzeigen auswählen, können Sie Attribute und Ansprüche für Land/Region, Anzeigename und Postleitzahl auswählen. Klicken Sie auf OK. (Benutzer werden nur zur Eingabe von Attributen aufgefordert, wenn sie sich zum ersten Mal registrieren.)

  6. Klicken Sie auf Erstellen. Der neue Benutzerflow wird in der Liste Benutzerflows angezeigt. Aktualisieren Sie die Seite bei Bedarf.

Führen Sie die Schritte im Artikel Aktivieren der Self-Service-Kennwortzurücksetzung aus, um die Self-Service-Kennwortzurücksetzung zu aktivieren.

Zuordnen der Webanwendung zum Benutzerflow

Damit die Benutzer des Kunden die Registrierungs- oder Anmeldeerfahrung sehen können, wenn sie Ihre App verwenden, müssen Sie Ihre App einem Benutzerflow zuordnen. Obwohl ihrem Benutzerflow viele Anwendungen zugeordnet werden können, kann eine einzelne Anwendung nur einem Benutzerflow zugeordnet werden.

  1. Wählen Sie im Menü der Seitenleiste die Option Identität aus.

  2. Wählen Sie External Identities und dann Benutzerflows aus.

  3. Wählen Sie auf der Seite Benutzerflows den zuvor erstellten Benutzerflownamen aus, z. B. SignInSignUpSample.

  4. Wählen Sie unter Verwenden die Option Anwendungen aus.

  5. Wählen Sie Anwendung hinzufügen aus.

  6. Wählen Sie die Anwendung in der Liste aus, z. B. ciam-client-app, oder verwenden Sie das Suchfeld, um die Anwendung zu suchen, und wählen Sie dann die Anwendung aus.

  7. Klicken Sie auf Auswählen.

Sobald Sie Ihre App einem Benutzerflow zuordnen, können Sie Ihren Benutzerflow testen, indem Sie die Registrierungs- oder Anmeldeerfahrung eines Benutzers mit Ihrer Anwendung im Microsoft Entra Admin Center simulieren. Verwenden Sie dazu die Schritte unter Testen des Registrierungs- und Anmeldebenutzerflows.

Klonen oder Herunterladen der Beispiel-Webanwendung

Um die Beispielanwendung zu erhalten, können Sie sie entweder von GitHub klonen oder als ZIP-Datei herunterladen.

  • Öffnen Sie zum Klonen des Beispiels eine Eingabeaufforderung, navigieren Sie zu der Stelle, an der Sie das Projekt erstellen möchten, und geben Sie den folgenden Befehl ein:

    git clone https://github.com/Azure-Samples/ms-identity-docs-code-python.git

  • ZIP-Datei herunterladen. Extrahieren Sie sie an einem Dateipfad, dessen Name weniger als 260 Zeichen umfasst.

Installieren von Projektabhängigkeiten

  1. Öffnen Sie ein Konsolenfenster, und wechseln Sie zum Verzeichnis mit der Flask-Beispielwebanwendung:

    cd flask-web-app

  2. Einrichten einer virtuellen Umgebung

    py -m venv .venv
.venv\scripts\activate

  3. Führen Sie die folgenden Befehle aus, um App-Abhängigkeiten zu installieren:

    python3 -m pip install -r requirements.txt

Konfigurieren der Beispiel-Webanwendung

  1. Öffnen Sie Ihre Projektdateien in Visual Studio Code oder im von Ihnen verwendeten Editor.

  2. Erstellen Sie eine .env-Datei im Stammordner des Projekts, indem Sie die .env.sample-Datei als Leitfaden verwenden.

  3. Geben Sie in der .env-Datei die folgenden Umgebungsvariablen an:

    • CLIENT_ID, das die Anwendungs-ID (Client)-ID der zuvor von Ihnen registrierten Anwendung ist.
    • CLIENT_SECRET, das der Wert des zuvor von Ihnen kopierten Anwendungsgeheimnisses ist.
    • AUTHORITY, das die URL ist, die eine Tokenautorität identifiziert. Sie sollte das Format https://{subdomain}.ciamlogin.com/{subdomain}.onmicrosoft.com aufweisen. Ersetzen Sie subdomain durch die Unterdomäne „Verzeichnis“ (Mandant). Wenn Ihre primäre Mandantendomäne beispielsweise contoso.onmicrosoft.com lautet, verwenden Sie contoso. Wenn Sie keine Mandantenunterdomäne haben, lernen Sie, wie Sie Ihre Mandantendetails auslesen.

  4. Vergewissern Sie sich, dass der Umleitungs-URI richtig konfiguriert ist. Der von Ihnen zuvor registrierte Umleitungs-URI sollte mit Ihrer Konfiguration übereinstimmen. In diesem Beispiel wird standardmäßig der Umleitungs-URI-Pfad auf /getAToken festgelegt. Dies ist in der app_config.py-Datei als REDIRECT_PATH konfiguriert.

Ausführen und Testen der Beispiel-Webanwendung

Führen Sie die Anwendung aus, um die Anmeldeerfahrung bei der Wiedergabe anzuzeigen.

Hinweis

In diesem Beispiel wird die Drittanbieterbibliothek für die Python-Identität verwendet. Die Bibliothek wird von Microsoft nicht offiziell unterhalten, wird aber für Ihre Verwendung empfohlen. Diese Bibliothek erleichtert das Hinzufügen der Authentifizierung zu Ihrer Webanwendung, da sie viele der MSAL Python-Details abstrahiert.

  1. Führen Sie in Ihrem Terminal den folgenden Befehl aus:

    python3 -m flask run --debug --host=localhost --port=3000

    Sie können den Port Ihrer Wahl verwenden. Dies sollte dem Port des Umleitungs-URI ähneln, den Sie zuvor registriert haben.

  2. Öffnen Sie Ihren Browser, und navigieren Sie zu http://localhost:3000. Die daraufhin angezeigte Seite sollte dem folgenden Screenshot ähneln:

    Screenshot der Beispielanmeldeseite der Flask-Webanwendung.

  3. Nachdem die Seite geladen wurde, wählen Sie den Link Anmelden aus. Sie werden zur Anmeldung aufgefordert.

  4. Geben Sie auf der Anmeldeseite Ihre E-Mail-Adresse ein, wählen Sie Weiter aus, geben Sie Ihr Kennwort ein und wählen Sie dann Anmelden aus. Wenn Sie kein Konto haben, wählen Sie den Link Kein Konto? Erstellen Sie eins aus, um den Registrierungsflow zu starten.

  5. Wenn Sie die Registrierungsoption auswählen, durchlaufen Sie den Registrierungsflow. Füllen Sie Ihre E-Mail, den Einmal-Passcode, das neue Kennwort und weitere Kontodetails aus, um den gesamten Registrierungsflow abzuschließen.

  6. Nachdem Sie sich angemeldet oder registriert haben, werden Sie zurück zur Webanwendung geleitet. Es wird eine Seite angezeigt, die dem folgenden Screenshot ähnelt:

    Screenshot der Flask-Beispielwebanwendung nach erfolgreicher Authentifizierung.

  7. Wählen Sie Abmelden aus, um den Benutzer bei der Webanwendung abzumelden, oder wählen Sie Nachgelagerte API aufrufen aus, um einen Aufruf an einen Microsoft Graph-Endpunkt durchzuführen.

Funktionsweise

Wenn Benutzer den Link Anmelden auswählen, initiiert die App eine Authentifizierungsanforderung und leitet Benutzer an Microsoft Entra External ID um. Ein Benutzer meldet sich dann auf der angezeigten Seite an oder registriert sich. Nachdem die erforderlichen Anmeldeinformationen eingegeben und den erforderlichen Bereichen zugestimmt wurde, leitet Microsoft Entra External ID den Benutzer mit einem Autorisierungscode zurück an die Webanwendung. Die Webanwendung verwendet dann diesen Autorisierungscode, um ein Token von Microsoft Entra External ID abzurufen.

Wenn der Benutzer den Link Abmelden auswählt, löscht die Anwendung die Sitzung und leitet den Benutzer an den Abmeldeendpunkt von Microsoft Entra External ID um, um ihn zu benachrichtigen, dass der Benutzer abgemeldet wurde. Der Benutzer wird dann zurück zur Webanwendung geleitet.

Zugehöriger Inhalt