Deutsch
  • asp-net-core
  • c-sharp
  • tutorial
  • auth
  • authentifizierung
  • oauth
  • oidc
  • identität

Erstellen Sie ASP.NET Core-Authentifizierung mit Logto

Lernen Sie, wie Sie einen Benutzerauthentifizierungsfluss mit ASP.NET Core erstellen, indem Sie das Logto SDK integrieren.

Gao
Gao
Founder

Einleitung

  • Logto ist eine moderne Alternative zu Auth0 für den Aufbau von kundenorientierter Identitätsinfrastruktur mit minimalem Aufwand. Es unterstützt verschiedene Anmeldemethoden, einschließlich Benutzername, E-Mail, Telefonnummer und beliebte soziale Anmeldungen wie Google und GitHub.
  • ASP.NET Core ist ein plattformübergreifendes, leistungsstarkes, Open-Source-Framework zum Erstellen moderner, cloudbasierter, internetverbundener Anwendungen.

In diesem Tutorial zeigen wir Ihnen, wie Sie einen Benutzerauthentifizierungsfluss mit ASP.NET Core erstellen, indem Sie das Logto SDK integrieren. Das Tutorial verwendet C# als Programmiersprache.

Voraussetzungen

Bevor Sie beginnen, stellen Sie sicher, dass Sie Folgendes haben:

  • Ein Logto-Konto. Wenn Sie keins haben, können Sie sich kostenlos anmelden.
  • Eine .NET-Entwicklungsumgebung und ein ASP.NET Core-Projekt. Wenn Sie keins haben, können Sie .NET installieren und den ASP.NET-Tutorials folgen, um Ihr Projekt einzurichten.

Erstellen Sie eine Logto-Anwendung

Um zu beginnen, erstellen Sie eine Logto-Anwendung mit dem Typ "Traditionelles Web". Befolgen Sie diese Schritte, um eine Logto-Anwendung zu erstellen:

  1. Melden Sie sich bei der Logto-Konsole an.
  2. Klicken Sie in der linken Navigationsleiste auf Anwendungen.
  3. Klicken Sie auf Anwendung erstellen.
  4. Auf der geöffneten Seite finden Sie den Abschnitt "Traditionelle Web-App" und sehen die Karte "ASP.NET Core".
  5. Klicken Sie auf Erstellen starten und geben Sie den Namen Ihrer Anwendung ein.
  6. Klicken Sie auf Erstellen.

Danach sollten Sie ein interaktives Tutorial sehen, das Sie durch den Prozess der Integration von Logto SDK in Ihre ASP.NET Core-Anwendung führt. Der folgende Inhalt kann für eine zukünftige Referenz dienen.

Versuchen Sie das interaktive Tutorial von Logto Cloud

Integration mit Logto SDK

Installation

Hinweis: Die Mindestversion von ASP.NET Core, die unterstützt wird, ist 6.0.

Fügen Sie Logto Authentifizierung Middleware hinzu

Öffnen Sie Startup.cs (oder Program.cs) und fügen Sie den folgenden Code hinzu, um die Logto Authentifizierung Middleware zu registrieren:

Die AddLogtoAuthentication Methode wird folgendes tun:

  • Setzen Sie das Standard-Authentifierungsschema auf LogtoDefaults.CookieScheme.
  • Setzen Sie das Standard-Herausforderungsschema auf LogtoDefaults.AuthenticationScheme.
  • Setzen Sie das Standard-Abmelde-Schema auf LogtoDefaults.AuthenticationScheme.
  • Fügen Sie Cookie- und OpenID Connect-Authentifizierungshandlern dem Authentifizierungsschema hinzu.

Anmeldung

Fügen Sie die folgende URI zur Liste der Redirect URIs in der Detailseite der Logto-Anwendung hinzu:

Um sich mit Logto anzumelden, können Sie die ChallengeAsync Methode verwenden:

Die ChallengeAsync Methode leitet den Benutzer zur Anmeldeseite von Logto um.

Die RedirectUri Eigenschaft wird verwendet, um den Benutzer nach der Authentifizierung zurück zu Ihrer Webanwendung zu leiten. Beachten Sie, dass es sich von der Weiterleitungs-URI unterscheidet, die Sie auf der Detailseite der Logto-Anwendung konfiguriert haben:

  1. Die Weiterleitungs-URI auf der Detailseite der Logto-Anwendung ist die URI, zu der Logto den Benutzer nach der Anmeldung umleitet.
  2. Die RedirectUri Eigenschaft ist die URI, die umgeleitet wird, nachdem die notwendigen Aktionen in der Logto Authentifizierungs-Middleware durchgeführt wurden.

Die Reihenfolge der Aktionen ist 1 -> 2. Zur Klarheit nennen wir die Weiterleitungs-URI auf der Detailseite der Logto-Anwendung die Logto Weiterleitungs-URI und die RedirectUri Eigenschaft die Anwendungsweiterleitungs-URI.

Die Logto Weiterleitungs-URI hat einen Standardwert von /Callback, den Sie so belassen können, wenn es keine besonderen Anforderungen gibt. Wenn Sie es ändern möchten, können Sie die CallbackPath Eigenschaft für LogtoOptions einstellen:

Vergessen Sie nicht, den Wert auf der Detailseite der Logto-Anwendung entsprechend zu aktualisieren.

Abmeldung

Fügen Sie die folgende URI zur Liste der Post sign-out redirect URIs auf der Detailseite der Logto-Anwendung hinzu:

Um sich mit Logto abzumelden, können Sie die SignOutAsync Methode verwenden:

Die SignOutAsync Methode löscht das Authentifizierungs-Cookie und leitet den Benutzer zur Abmeldeseite von Logto um.

Die RedirectUri Eigenschaft wird verwendet, um den Benutzer nach der Abmeldung zurück zu Ihrer Webanwendung zu leiten. Beachten Sie, dass es sich von der Umleitungs-URI nach Abmeldung unterscheidet, die Sie auf der Detailseite der Logto-Anwendung konfiguriert haben:

  1. Die Weiterleitungs-URI nach Abmeldung auf der Detailseite der Logto-Anwendung ist die URI, zu der Logto den Benutzer nach der Abmeldung umleitet.
  2. Die RedirectUri Eigenschaft ist die URI, die umgeleitet wird, nachdem die notwendigen Aktionen in der Logto Authentifizierungs-Middleware durchgeführt wurden.

Die Reihenfolge der Aktionen ist 1 -> 2. Zur Klarheit nennen wir die Weiterleitungs-URI nach Abmeldung auf der Detailseite der Logto-Anwendung die Logto Weiterleitungs-URI nach Abmeldung und die RedirectUri Eigenschaft die Anwendungs-Weiterleitungs-URI nach Abmeldung.

Die Logto Weiterleitungs-URI nach Abmeldung hat einen Standardwert von /SignedOutCallback, den Sie so belassen können, wenn es keine besonderen Anforderungen gibt. Wenn Sie es ändern möchten, können Sie die SignedOutCallbackPath Eigenschaft für LogtoOptions einstellen:

Vergessen Sie nicht, den Wert auf der Detailseite der Logto-Anwendung entsprechend zu aktualisieren.

Implementieren Sie Anmelde-/Abmelde-Buttons (Razor Pages)

Zunächst fügen Sie die Handler-Methoden zu Ihrem PageModel hinzu, zum Beispiel:

Dann fügen Sie die Buttons zu Ihrer Razor-Seite (html) hinzu:

<p>Ist authentifiziert: @User.Identity?.IsAuthenticated</p>
<form method="post">
  @if (User.Identity?.IsAuthenticated == true)
  {
    <button type="submit" asp-page-handler="SignOut">Abmelden</button>
  } else {
    <button type="submit" asp-page-handler="SignIn">Anmelden</button>
  }
</form>

Es zeigt den "Anmelden"-Button an, wenn der Benutzer nicht authentifiziert ist, und den "Abmelden"-Button, wenn der Benutzer authentifiziert ist.

Kontrollpunkt: Führen Sie die Webanwendung aus

Jetzt können Sie die Webanwendung ausführen und versuchen, sich mit Logto an- und abzumelden:

  1. Öffnen Sie die Webanwendung in Ihrem Browser, Sie sollten "Ist authentifiziert: False" und den "Anmelden"-Button sehen.
  2. Klicken Sie auf den "Anmelden"-Button und Sie sollten zur Anmeldeseite von Logto umgeleitet werden.
  3. Nachdem Sie sich angemeldet haben, sollten Sie zurück zur Webanwendung umgeleitet werden und Sie sollten "Ist authentifiziert: True" und den "Abmelden"-Button sehen.
  4. Klicken Sie auf den "Abmelden"-Button und Sie sollten zur Abmeldeseite von Logto umgeleitet werden und dann zurück zur Webanwendung.

Wenn Sie während der Integration auf Probleme stoßen, zögern Sie nicht, uns per E-Mail unter [email protected] zu kontaktieren oder unserem Discord-Server beizutreten!

Weiterführende Literatur

Versuchen Sie noch heute Logto