Chi tiết cách làm trang đăng nhập bằng ASP.NET MVC

Bài viết dưới đây chúng tôi sẽ hướng dẫn quý bạn đọc cách làm trang đăng nhập bằng ASP.NET MVC nhanh chóng, đơn giản nhất. Hãy cùng chúng tôi bắt đầu tìm hiểu chi tiết nhé.

ASP.NET MVC là gì?

Học lập trình web trực tuyến bằng ứng dụng ASP.NET MVCASP.NET MVC là một trong những framework tuyệt vời để hỗ trợ pattern MVC cho ASP.NET. Nếu bạn đang muốn tìm hiểu ASP.NET MVC làm việc như thế nào, bạn đọc cần phải có sự hiểu biết chi tiết về mô hình MVC. MVC là thuật ngữ viết tắt của các cụm từ Model-View-Controller.

Model có chức năng lưu trữ dữ liệu của ứng dụng và tất cả trạng thái của nó. Đây là một cơ sở dữ liệu hoặc cũng có thể đơn giản chỉ là một tập tin XML.
View được coi là một giao diện mà người dùng được sử dụng bởi các khách hàng truy cập vào trang web của bạn để có thể nhìn thấy các dữ liệu. Các trang ASPX thường được sử dụng để giúp hiển thị view ở trong các ứng dụng ASP.NET MVC.
Controller sẽ chịu trách nhiệm việc xử lý mọi tương tác của người dùng đối với trang web. Controller được sử dụng để xác định loại view nào cần được hiển thị. Controller còn được sử dụng với mục đích để giao tiếp với model.

Cách làm trang đăng nhập bằng ASP.NET MVC

Dưới đây là toàn bộ code của cách làm trang đăng nhập bằng ASP.NET MVC:

using System;

using System.Collections.Generic;

using System.ComponentModel.DataAnnotations;

using System.Linq;

using System.Text.Encodings.Web;

using System.Threading.Tasks;

using Album.Models;

using Microsoft.AspNetCore.Authentication;

using Microsoft.AspNetCore.Authorization;

using Microsoft.AspNetCore.Identity;

using Microsoft.AspNetCore.Identity.UI.Services;

using Microsoft.AspNetCore.Mvc;

using Microsoft.AspNetCore.Mvc.RazorPages;

using Microsoft.Extensions.Logging;

using XTLASPNET;

namespace Album.Areas.Identity.Pages.Account {

[AllowAnonymous]

public class LoginModel : PageModel {

private readonly UserManager<AppUser> _userManager;

private readonly SignInManager<AppUser> _signInManager;

private readonly ILogger<LoginModel> _logger;

public LoginModel (SignInManager<AppUser> signInManager,

ILogger<LoginModel> logger,

UserManager<AppUser> userManager) {

_userManager = userManager;

_signInManager = signInManager;

_logger = logger;

}

[BindProperty]

public InputModel Input { get; set; }

public IList<AuthenticationScheme> ExternalLogins { get; set; }

public string ReturnUrl { get; set; }

[TempData]

public string ErrorMessage { get; set; }

public class InputModel {

[Required (ErrorMessage = “Không để trống”)]

[Display (Name = “Nhập username hoặc email của bạn”)]

[StringLength (100, MinimumLength = 1, ErrorMessage = “Nhập đúng thông tin”)]

public string UserNameOrEmail { set; get; }

[Required]

[DataType (DataType.Password)]

[Display(Name = “Mật khẩu”)]

public string Password { get; set; }

[Display (Name = “Nhớ thông tin đăng nhập?”)]

public bool RememberMe { get; set; }

}

public async Task OnGetAsync (string returnUrl = null) {

if (!string.IsNullOrEmpty (ErrorMessage)) {

ModelState.AddModelError (string.Empty, ErrorMessage);

}

returnUrl = returnUrl ?? Url.Content (“~/”);

// Clear the existing external cookie to ensure a clean login process

await HttpContext.SignOutAsync (IdentityConstants.ExternalScheme);

ExternalLogins = (await _signInManager.GetExternalAuthenticationSchemesAsync ()).ToList ();

ReturnUrl = returnUrl;

}

public async Task<IActionResult> OnPostAsync (string returnUrl = null) {

returnUrl = returnUrl ?? Url.Content (“~/”);

// Đã đăng nhập nên chuyển hướng về Index

if (_signInManager.IsSignedIn (User)) return Redirect (“Index”);

if (ModelState.IsValid) {

// Thử login bằng username/password

var result = await _signInManager.PasswordSignInAsync (

Input.UserNameOrEmail,

Input.Password,

Input.RememberMe,

true

);

if (!result.Succeeded) {

// Thất bại username/password -> tìm user theo email, nếu thấy thì thử đăng nhập

// bằng user tìm được

var user = await _userManager.FindByEmailAsync (Input.UserNameOrEmail);

if (user != null) {

result = await _signInManager.PasswordSignInAsync (

user,

Input.Password,

Input.RememberMe,

true

);

}

if (result.Succeeded) {

_logger.LogInformation (“User đã đăng nhập”);

return ViewComponent(MessagePage.COMPONENTNAME, new MessagePage.Message() {

title = “Đã đăng nhập”,

htmlcontent = “Đăng nhập thành công”,

urlredirect = returnUrl

});

}

if (result.RequiresTwoFactor) {

// Nếu cấu hình đăng nhập hai yếu tố thì chuyển hướng đến LoginWith2fa

return RedirectToPage (“./LoginWith2fa”, new { ReturnUrl = returnUrl, RememberMe = Input.RememberMe });

}

if (result.IsLockedOut) {

_logger.LogWarning (“Tài khoản bí tạm khóa.”);

// Chuyển hướng đến trang Lockout – hiện thị thông báo

return RedirectToPage (“./Lockout”);

} else {

ModelState.AddModelError (string.Empty, “Không đăng nhập được.”);

return Page ();

}

// If we got this far, something failed, redisplay form

return Page ();

}

@page “/login/”

@model LoginModel

ViewData[“Title”] = “ĐĂNG NHẬP”;

}

<h1>@ViewData[“Title”]</h1>

<h4>Điền thông tin để đăng nhập.</h4>

<hr />

</div>

</div>

@Html.DisplayNameFor(m => m.Input.RememberMe)

</label>

</div>

</div>

<p>

<a id=“forgot-password” asp–page=“./ForgotPassword”>Bạn quyên mật khẩu?</a>

</p>

<p>

<a asp–page=“./Register” asp–route–returnUrl=“@Model.ReturnUrl”>Chưa có tài khoản, đăng ký mới</a>

</p>

</div>

</form>

</section>

</div>

<hr />

if ((Model.ExternalLogins?.Count ?? 0) == 0)

{

<div>

<p>

Chưa cấu hình đăng nhập bằng dịch vụ khác. See <a href=“https://go.microsoft.com/fwlink/?LinkID=532715”>this article</a>

</p>

</div>

}

else

{

<div>

<p>

@foreach (var provider in Model.ExternalLogins)

{

<button type=“submit” class=“btn btn-primary” name=“provider” value=“@provider.Name” title=“Log in using your @provider.DisplayName account”>@provider.DisplayName</button>