繁體中文(台灣)
  • asp-net-core
  • c-sharp
  • tutorial
  • auth
  • authentication
  • oauth
  • oidc
  • identity

使用 Logto 建立 ASP.NET Core 驗證

了解如何通過整合 Logto SDK 來建立 ASP.NET Core 的用戶驗證流程。

Gao
Gao
Founder

介紹

  • Logto 是一個現代化的 Auth0 替代方案,用於以最小的工夫構建客戶身份基礎設施。它支持多種登入方法,包括用戶名、電子郵件、電話號碼以及 Google 和 GitHub 等流行的社交登入。
  • ASP.NET Core 是一個跨平台的高效能開源框架,用於構建現代化、基於雲端、互聯網連接的應用程式。

在這個教程中,我們將向你展示如何通過整合 Logto SDK 來構建 ASP.NET Core 的用戶驗證流程。教程使用 C# 作為編程語言。

先決條件

在你開始之前,請確保你擁有以下條件:

  • 一個 Logto 帳戶。如果你沒有,請免費註冊
  • 一個 .NET 開發環境和一個 ASP.NET Core 專案。如果你沒有,可以安裝 .NET並按照ASP.NET 教程來設置你的專案。

創建 Logto 應用

要開始,請創建一個「傳統網頁」類型的 Logto 應用。按照這些步驟創建 Logto 應用:

  1. 登入到 Logto 控制台
  2. 在左側導航欄中,點擊 應用程式
  3. 點擊 創建應用程式
  4. 在打開的頁面中,找到「傳統網頁應用」部分,並找到「ASP.NET Core」卡片。
  5. 點擊 開始構建,並輸入你的應用程式名稱。
  6. 點擊 創建

然後你應該會看到一個互動教程,引導你完成將 Logto SDK 整合到你的 ASP.NET Core 應用程式中的過程。以下內容可以作為未來使用的參考。

整合 Logto SDK

安裝

請注意,ASP.NET Core 的最低支持版本為 6.0

添加 Logto 驗證中介軟體

打開 Startup.csProgram.cs,並添加以下程式碼來註冊 Logto 驗證中介軟體:

AddLogtoAuthentication 方法將做以下幾件事:

  • 將默認驗證方案設置為 LogtoDefaults.CookieScheme
  • 將默認挑戰方案設置為 LogtoDefaults.AuthenticationScheme
  • 將默認註銷方案設置為 LogtoDefaults.AuthenticationScheme
  • 為驗證方案添加 cookie 和 OpenID Connect 驗證處理程序。

登入

在 Logto 應用程式詳情頁中將以下 URI 添加到 重定向 URI 列表中:

要使用 Logto 登入,你可以使用 ChallengeAsync 方法:

ChallengeAsync 方法將把用戶重定向到 Logto 登入頁面。

RedirectUri 屬性用於在驗證後將用戶重定向回你的 web 應用程式。注意,它與在 Logto 應用程式詳情頁配置的重定向 URI 不同:

  1. Logto 應用程式詳情頁中的重定向 URI 是 Logto 在用戶簽到後將用戶重定向回去的 URI。
  2. RedirectUri 屬性是執行 Logto 驗證中介軟體中的必要操作後將被重定向的 URI。

動作的順序是 1 -> 2。為清晰起見,我們將 Logto 應用程式詳情頁中的重定向 URI 稱為 Logto 重定向 URI,而 RedirectUri 屬性稱為 應用程式重定向 URI

Logto 重定向 URI 默認值為 /Callback,如果沒有特別要求,你可以保持不變。如果你想更改它,可以為 LogtoOptions 設置 CallbackPath 屬性:

記得在 Logto 應用程式詳情頁中相應更新該值。

登出

在 Logto 應用程式詳情頁中將以下 URI 添加到 登出後重定向 URI 列表中:

要使用 Logto 登出,你可以使用 SignOutAsync 方法:

SignOutAsync 方法將清除驗證 cookie 並將用戶重定向到 Logto 登出頁面。

RedirectUri 屬性用於在登出後將用戶重定向回你的 web 應用程式。注意,它與在 Logto 應用程式詳情頁配置的登出後重定向 URI 不同:

  1. Logto 應用程式詳情頁中的登出後重定向 URI 是 Logto 在用戶登出後將用戶重定向回去的 URI。
  2. RedirectUri 屬性是執行 Logto 驗證中介軟體中的必要操作後將被重定向的 URI。

動作的順序是 1 -> 2。為清晰起見,我們將 Logto 應用程式詳情頁中的登出後重定向 URI 稱為 Logto 登出後重定向 URI,而 RedirectUri 屬性稱為 應用程式登出後重定向 URI

Logto 登出後重定向 URI 默認值為 /SignedOutCallback,如果沒有特別要求,你可以保持不變。如果你想更改它,可以為 LogtoOptions 設置 SignedOutCallbackPath 屬性:

記得在 Logto 應用程式詳情頁中相應更新該值。

實現登入/登出按鈕 (Razor Pages)

首先,將處理程序方法添加到你的 PageModel 中,例如:

然後,將按鈕添加到你的 Razor 頁面(html):

<p>Is authenticated: @User.Identity?.IsAuthenticated</p>
<form method="post">
  @if (User.Identity?.IsAuthenticated == true)
  {
    <button type="submit" asp-page-handler="SignOut">Sign out</button>
  } else {
    <button type="submit" asp-page-handler="SignIn">Sign in</button>
  }
</form>

如果用戶未驗證,則會顯示「Sign in」按鈕;如果用戶已驗證,則會顯示「Sign out」按鈕。

檢查點:運行 web 應用程式

現在你可以運行 web 應用程式並嘗試使用 Logto 登入/登出:

  1. 在瀏覽器中打開 web 應用程式,你應該會看到「Is authenticated: False」和「Sign in」按鈕。
  2. 點擊「Sign in」按鈕,你應該會被重定向到 Logto 登入頁面。
  3. 簽到後,你應該會被重定向回 web 應用程式,並且你應該會看到「Is authenticated: True」和「Sign out」按鈕。
  4. 點擊「Sign out」按鈕,你應該會被重定向到 Logto 登出頁面,然後再重定向回 web 應用程式。

如果在整合過程中遇到任何問題,請隨時通過電子郵件聯繫我們:[email protected] 或者加入我們的 Discord 伺服器

更多閱讀