Freigeben über

Tutorial: Erstellen einer .NET MAUI-Shell-App

  • Artikel

Dieses Tutorial ist der 2. Teil einer Reihe, in der das Erstellen einer .NET MAUI-Shell-App (Multi-Platform App UI) und ihre Vorbereitung für die Authentifizierung mithilfe des Microsoft Entra Admin Centers veranschaulicht wird. In Teil 1 dieser Reihe haben Sie eine Anwendung registriert und Benutzerflows in Ihrem externen Mandanten konfiguriert. In diesem Tutorial fügen Sie außerdem ein benutzerdefiniertes MSAL-Clienthilfsprogramm (Microsoft Authentication Library) hinzu, um das MSAL-SDK zu initialisieren, erforderliche Bibliotheken zu installieren und eine Bildressource einzuschließen.

In diesem Tutorial gehen Sie wie folgt vor:

  • Erstellen einer .NET MAUI-Shell-App
  • Hinzufügen von MSAL SDK-Unterstützung mithilfe von MSAL-Hilfsprogrammklassen
  • Installieren erforderlicher Pakete
  • Hinzufügen einer Bildressource

Voraussetzungen

Erstellen einer .NET MAUI-Shell-App

  1. Wählen Sie im Startfenster von Visual Studio 2022 die Option Neues Projekt erstellen aus.
  2. Wählen Sie im Fenster Neues Projekt erstellen in der Dropdownliste „Alle Projekttypen“ die Option MAUI aus, und wählen Sie die Vorlage .NET MAUI-App und dann Weiter aus.
  3. Im Fenster Neues Projekt konfigurieren muss Projektname auf SignInMaui festgelegt werden. Aktualisieren Sie den Projektmappennamen in sign-in-maui, und wählen Sie Weiter aus.
  4. Wählen Sie im Fenster Zusätzliche Informationen die Option .NET 7.0 und dann Erstellen aus.

Warten Sie, bis das Projekt erstellt wurde und seine Abhängigkeiten wiederhergestellt wurden.

Hinzufügen von MSAL SDK-Unterstützung mithilfe von MSAL-Hilfsprogrammklassen

Der MSAL-Client ermöglicht Entwicklern und Entwicklerinnen das Abrufen von Sicherheitstoken aus einem externen Mandanten für die Authentifizierung geschützter Web-APIs und den Zugriff darauf. In diesem Abschnitt laden Sie Dateien herunter, aus denen „MSALClient“ besteht.

Laden Sie die folgenden Dateien in einen Ordner auf Ihrem Computer herunter:

  • AzureAdConfig.cs: Diese Datei ruft die eindeutigen Bezeichner der Microsoft Entra-App aus Ihrer App-Konfigurationsdatei ab und legt sie fest.
  • DownStreamApiConfig.cs: Diese Datei ruft die Bereiche für den Microsoft Graph-Aufruf ab und legt sie fest.
  • DownstreamApiHelper.cs: Diese Datei behandelt die Ausnahmen, die beim Aufrufen der Downstream-API auftreten.
  • Exception.cs: Diese Datei bietet einige Erweiterungsmethoden im Zusammenhang mit dem Auslösen und Behandeln von Ausnahmen.
  • IdentityLogger.cs: Diese Datei zeigt, wie die MSAL.NET-Protokollierung verwendet wird.
  • MSALClientHelper.cs: Diese Datei enthält Methoden zum Initialisieren des MSAL-SDKs.
  • PlatformConfig.cs: Diese Datei enthält Methoden zur Behandlung bestimmter Plattformen. Beispiel: Windows.
  • PublicClientSingleton.cs: Diese Datei enthält eine Singletonimplementierung zum Umschließen von „MSALClient“ und der zugehörigen Klassen zur Unterstützung des statischen Initialisierungsmodells für Plattformen.
  • WindowsHelper.cs: Diese Datei enthält Methoden zum Abrufen des Fensterhandles.

Wichtig

Überspringen Sie das Herunterladen der MSALClient-Dateien nicht, sie sind erforderlich, um dieses Tutorial abzuschließen.

Verschieben der MSALClient-Dateien mit Visual Studio

  1. Klicken Sie im Bereich Projektmappen-Explorer mit der rechten Maustaste auf das Projekt SignInMaui, und wählen Sie Hinzufügen>Neuer Ordner aus. Nennen Sie den Ordner MSALClient.
  2. Klicken Sie mit der rechten Maustaste auf den Ordner MSALClient, und wählen Sie Hinzufügen>Vorhandenes Element… aus.
  3. Navigieren Sie zu dem Ordner, der die heruntergeladenen MSALClient-Dateien enthält, die Sie zuvor heruntergeladen haben.
  4. Markieren Sie alle MSALClient-Dateien, die Sie heruntergeladen haben, und wählen Sie dann Hinzufügen aus.

Installieren erforderlicher Pakete

Sie müssen die folgenden Pakete installieren:

  • Microsoft.Identity.Client: Dieses Paket enthält die Binärdateien der Microsoft-Authentifizierungsbibliothek für .NET (MSAL.NET).
  • Microsoft.Extensions.Configuration.Json: Dieses Paket enthält die Implementierung der JSON-Konfigurationsanbieter für Microsoft.Extensions.Configuration.
  • Microsoft.Extensions.Configuration.Binder: Dieses Paket enthält Funktionen zum Binden eines Objekts an Daten in Konfigurationsanbietern für Microsoft.Extensions.Configuration.
  • Microsoft.Extensions.Configuration.Abstractions: Dieses Paket enthält Abstraktionen der auf Schlüssel-Wert-Paaren basierenden Konfiguration.
  • Microsoft.Identity.Client.Extensions.Msal: Dieses Paket enthält Erweiterungen der Microsoft-Authentifizierungsbibliothek für .NET (MSAL.NET).

NuGet-Paket-Manager

Führen Sie die folgenden Schritte aus, um den NuGet-Paket-Manager zum Installieren des Microsoft.Identity.Client-Pakets in Visual Studio zu verwenden:

  1. Wählen Sie Tools>NuGet-Paket-Manager>NuGet-Pakete für Projektmappe verwalten... aus.
  2. Suchen Sie auf der Registerkarte Durchsuchen nach Microsoft.Identity.Client.
  3. Wählen Sie in der Liste Microsoft.Identity.Client aus.
  4. Wählen Sie SignInMaui im Listenbereich Projekt aus.
  5. Wählen Sie Installieren aus.
  6. Wenn Sie aufgefordert werden, die Installation zu überprüfen, wählen Sie OK aus.

Wiederholen Sie den Vorgang, um die verbleibenden erforderlichen Pakete zu installieren.

Hinzufügen einer Bildressource

In diesem Abschnitt laden Sie ein Bild herunter, das Sie in Ihrer App verwenden, um die Interaktion von Benutzer*innen damit zu verbessern.

Laden Sie das folgende Bild herunter:

Verschieben des Bilds mit Visual Studio

  1. Erweitern Sie im Bereich Projektmappen-Explorer von Visual Studio den Ordner Ressourcen, woraufhin der Ordner Bilder angezeigt wird.
  2. Klicken Sie mit der rechten Maustaste auf Bilder, und wählen Sie Hinzufügen>Vorhandenes Element… aus.
  3. Navigieren Sie zum Ordner mit den heruntergeladenen Bildern.
  4. Ändern Sie den Dateitypfilter in Bilddateien.
  5. Wählen Sie das heruntergeladene Bild aus.
  6. Wählen Sie Hinzufügen aus.

Nächster Schritt

Teil 3: Tutorial: Anmelden von Benutzern bei der .NET MAUI-Shell-App mithilfe eines externen Mandanten