ASP.NET Core - 使用者註冊

本章將討論使用者註冊。我們現在有一個可用的資料庫，是時候開始嚮應用程式新增一些功能了。我們還配置了應用程式，並擁有一個可用的資料庫模式。現在讓我們轉到應用程式主頁。

按 F12 開啟開發者工具，然後單擊“編輯”連結。之前，當我們單擊“編輯”連結時，MVC 框架檢測到 Authorize 屬性的存在並返回 401 狀態程式碼，因為使用者未登入。

您現在將看到我們在螢幕上收到了來自配置檔案的訊息。

現在讓我們轉到開發者工具。

您將看到瀏覽器請求了編輯頁面，MVC 框架確定使用者無權檢視此資源。
因此，在 MVC 框架中的某個地方，生成了 401 狀態程式碼。
我們現在已經安裝了 Identity 中介軟體。Identity 中介軟體檢視將要傳送給使用者的 401 狀態程式碼，並將其替換為 302 狀態程式碼，這是一個重定向狀態程式碼。
Identity 框架知道使用者必須先嚐試登入才能訪問此資源。
Identity 框架將我們定向到此 URL，如我們在位址列中看到的——/Account/Login。
這是一個可配置的端點，位於 Identity 框架中，在註冊這些服務和中介軟體時的 Startup 中。您可以設定不同的選項，其中一個選項是更改登入 URL。
預設情況下，URL 將為 /Account/Login。目前，我們沒有帳戶控制器，因此最終我們要做的是建立一個帳戶控制器並允許使用者登入。
但在使用者甚至可以登入之前，他們需要在站點上註冊並儲存其使用者名稱和密碼。
登入和註冊功能都可以是帳戶控制器的一部分。

現在讓我們繼續並在 Controllers 資料夾中新增一個新類，並將其命名為 AccountController。我們將從 MVC 框架基礎 Controller 類派生此類。

using Microsoft.AspNet.Mvc; 

using System; 
using System.Collections.Generic; 
using System.ComponentModel.DataAnnotations;
using System.Linq; 
using System.Threading.Tasks;  

namespace FirstAppDemo.Controllers { 
   public class AccountController : Controller {  
   } 
}

我們現在必須設定一個使用者可以註冊此站點的功能。
它將非常類似於編輯表單。
當用戶想要註冊時，我們將首先顯示一個表單，允許他們填寫所需的資訊。然後，他們可以將此表單上傳到站點。
這些資訊隨後儲存在資料庫中。

現在讓我們建立當我們轉到 /account/register 時將返回檢視的操作。

public class AccountController : Controller { 
   [HttpGet] 
   public ViewResult Register() { 
      return View(); 
   } 
}

我們不需要查詢任何內容，使用者將提供我們所需的所有資訊。在我們為該檢視構建 ViewModel 之前，我們需要確定檢視將顯示哪些資訊。我們還需要確定我們需要從使用者那裡接收哪些資訊？

讓我們透過在 AccountController.cs 檔案中新增一個新類並將其命名為 RegisterViewModel 來為此場景建立一個檢視模型。

讓我們建立一些屬性來儲存使用者名稱、密碼以及使用者透過兩次輸入並確保兩個密碼匹配的確認密碼，如下面的程式所示。

public class RegisterViewModel { 
   [Required, MaxLength(256)] 
   public string Username { get; set; }  
   
   [Required, DataType(DataType.Password)] 
   public string Password { get; set; }  
   
   [DataType(DataType.Password), Compare(nameof(Password))] 
   public string ConfirmPassword { get; set; } 
}

在上方的類中，您可以看到一些可以幫助我們驗證此模型的註釋。使用者名稱在此處是必需的，如果您檢視資料庫模式，則儲存使用者名稱的列長度為 256 個字元。

我們還將在此處應用 MaxLength 屬性。
密碼將是必需的，當我們為此密碼呈現輸入時，我們希望輸入型別為 **密碼型別**，以便字元不會顯示在螢幕上。
**確認密碼**也將是 DataType 密碼，然後還有一個額外的 Compare 屬性。我們將使用我們可以指定的另一個屬性（即 Password 欄位）來比較 ConfirmPassword 欄位。

現在讓我們建立所需的檢視。我們需要向檢視中新增一個新資料夾並將其命名為 Account，因此與 AccountController 相關的所有檢視都將新增到此資料夾中。

現在，右鍵單擊 Account 資料夾並選擇新增→新建項。

在中間窗格中，選擇 MVC 檢視頁面並將其命名為 Register.cshtml，然後單擊“新增”按鈕。

刪除 Register.cshtml 檔案中的所有現有程式碼，並新增以下程式碼。

@model RegisterViewModel 
@{ 
   ViewBag.Title = "Register"; 
}  
<h1>Register</h1> 

<form method = "post" asp-controller = "Account" asp-action = "Register"> 
   <div asp-validation-summary = "ValidationSummary.ModelOnly"></div> 
   
   <div> 
      <label asp-for = "Username"></label> 
      <input asp-for = "Username" /> 
      <span asp-validation-for = "Username"></span> 
    </div> 
   
   <div> 
      <label asp-for = "Password"></label> 
      <input asp-for = "Password" /> 
      <span asp-validation-for = "Password"></span> 
   </div> 
   
   <div> 
      <label asp-for = "ConfirmPassword"></label> 
      <input asp-for = "ConfirmPassword" /> 
      <span asp-validation-for = "ConfirmPassword"></span> 
   </div> 
    
   <div> 
      <input type = "submit" value = "Register" /> 
   </div> 

</form>

您現在可以看到我們已將模型指定為我們剛剛建立的 RegisterViewModel。
我們還將使用 ViewBag 設定此頁面的標題，並且我們希望標題為“註冊”。
我們還需要建立一個包含使用者名稱、密碼和確認密碼欄位的表單。
我們還包含了一個將顯示驗證摘要的 div。當我們使用 ASP 驗證摘要時，我們需要指定哪些錯誤將出現在摘要中。
我們可以讓所有錯誤都出現在摘要區域中，或者我們可以說 ValidationSummary.ModelOnly，並且只有出現在模型驗證中的摘要中的錯誤才是與模型相關的驗證錯誤，而不是該模型的特定屬性。
換句話說，如果使用者沒有填寫他們的使用者名稱，但使用者名稱是必需的，那麼將會有一個針對該特定屬性的驗證錯誤。
但您也可以生成與特定屬性無關的模型錯誤，它們將出現在此 ValidationSummary 中。
在 <form> 標籤內，我們為 ViewModel 中的所有不同欄位都帶有標籤和輸入。
我們需要使用者名稱標籤、使用者名稱輸入以及使用者名稱驗證訊息。
我們需要使用者輸入的其他兩個屬性是相同的，它們將具有密碼的標籤、輸入和跨度，以及確認密碼的標籤、輸入和跨度。
我們不需要為密碼和確認密碼指定輸入型別，因為 **asp** for 標籤助手將確保為我們設定該輸入型別為密碼。
最後，我們需要一個顯示 **註冊** 的按鈕。當用戶單擊此按鈕時，我們將表單提交回控制器。

在 AccountController 中，我們還需要實現一個 HttpPost Register 操作方法。讓我們返回 AccountController 並新增以下 Register 操作：

[HttpPost] 
public IActionResult Register (RegisterViewModel model) {  
}

此操作方法將返回 IActionResult。這將接收 RegisterViewModel。現在，我們需要與 Identity 框架進行互動以確保使用者有效，告訴 Identity 框架建立該使用者，然後因為他們剛剛建立了帳戶，所以繼續登入他們。我們將在下一章中討論實現所有這些步驟。

列印頁面