ASP.NET Core – Identity / Custom Identity Projesi – Login ve Logout İşlemleri #3

Bir önceki yazıda kullanıcı kayıt işlemini gerçekleştirmiştik. Bu yazımızda login ve logout işlemini gerçekleştireceğiz. Ancak öncesinde sitenin navbar’ında bulunan Register linkinin yanına Login linkini de ekleyelim ve kullanıcı giriş yapmışsa Logout linkini ve giriş yapan kullanıcının kullanıcı adını gösterelim. Bunun için ilk olarak Views / Shared / _ViewImports.cshtml razorview’ına aşağıdaki kodu ekliyoruz. Bu kod ile ilgili package’da bulunan sınıfları view tarafında kullanabilir hale geliyoruz.

@using Microsoft.AspNetCore.Identity

Ardından Views / Shared / _ViewImports.cshtml dosyasının en üstüne aşağıdaki direktifi ekliyoruz Böylece SıgnInManager sınıfının view tarafına inject işlemini gerçekleştiriyor ve örneğini oluşturuyoruz.

@inject SignInManager<AppUser> signInManager;

Views / Shared / _Layout.cshtml dosyasındaki nav elementini aşağıdaki şekilde düzenliyoruz.

        <nav class="navbar navbar-expand-sm navbar-toggleable-sm navbar-light bg-white border-bottom box-shadow mb-3">
            <div class="container-fluid">
                <a class="navbar-brand" asp-area="" asp-controller="Home" asp-action="Index">IdentityCustomProject</a>
                <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target=".navbar-collapse" aria-controls="navbarSupportedContent"
                        aria-expanded="false" aria-label="Toggle navigation">
                    <span class="navbar-toggler-icon"></span>
                </button>
                <div class="navbar-collapse collapse d-sm-inline-flex justify-content-between">
                    <ul class="navbar-nav flex-grow-1">
                        <li class="nav-item">
                            <a class="nav-link text-dark" asp-area="" asp-controller="Home" asp-action="Index">Home</a>
                        </li>
                    </ul>
                    <ul class="navbar-nav">
                        @if (signInManager.IsSignedIn(User))
                        {
                            <li class="nav-item">
                                <span style="display: block; padding:.5rem 1rem">Hi, @User.Identity.Name </span>
                            </li>
                            <li class="nav-item">
                                <form method="post" asp-action="Logout" asp-controller="Account">
                                    <button type="submit" class="btn btn-outline-warning">Logout</button>
                                </form>
                            </li>
                        } 
                        else
                        {
                            <li class="nav-item">
                                <a class="btn  btn-outline-primary" asp-controller="Account" asp-action="Register">Register</a>
                            </li>
                            <li class="nav-item" style="margin-left:5px">
                                <a class="btn btn-outline-primary" asp-controller="Account" asp-action="Login">Login</a>
                            </li>                         
                        }
                    </ul>
                </div>
            </div>
        </nav>

Login olunduktan sonraki Front-end tarafını hallettik şimdi Login ve Logout işlemlerini gerçekleştirelim. İlk olarak ViewModels klasörü altına Login işlemi için kullanacağımız LoginViewModel sınıfını oluşturuyor ve aşağıdaki şekilde düzenliyoruz.

using System.ComponentModel.DataAnnotations;

namespace IdentityCustomProject.ViewModels
{
    public class LoginViewModel
    {
        [Required]
        public string KullaniciAdi { get; set; }

        [Required]
        [DataType(DataType.Password)]
        public string Password { get; set; }

        [Display(Name ="Remember me")]
        public bool RememberMe { get; set; }
    }
}

Şimdi Login işleminin gerçekleşeceği ekranı tasarlamak için Views / Account klasörü altına Login.cshtml dosyası oluşturup aşağıdaki şekilde düzenleyelim.

@model LoginViewModel
@{
    ViewData["Title"] = "Login";
}

<h2>User Login</h2>
<div>
    <div class=col-md-12>
        <form method="post">
            <div asp-validation-summary="All" class="text-danger"></div>
            <div class="mb-3">
                <input asp-for="UserName" class="form-control" placeHolder="Username" />
                <span asp-validation-for="UserName" class="text-danger"></span>
            </div>
            <div class="mb-3">
                <input asp-for="Password" type="password" class="form-control" placeHolder="Password" />
                <span asp-validation-for="Password" class="text-danger"></span>
            </div>
            <div class="mb-3">
                <div class="checkbox">
                    <label asp-for="RememberMe" >
                        <input asp-for="RememberMe" />
                        @Html.DisplayNameFor(x => x.RememberMe)
                    </label>
                </div>
            </div>
            <button type="submit" class="btn btn-primary">Login</button>
        </form>
    </div>
</div>

AccoutController.cs dosyasına aşağıda yer alan Login ve Logout metdolarını ekliyoruz.

        [HttpGet]
        public IActionResult Login()
        {
            return View();
        }

        [HttpPost]
        public async Task<IActionResult> Login(LoginViewModel loginViewModel)
        {
            if (ModelState.IsValid)
            {
                var result = await _signInManager.PasswordSignInAsync(loginViewModel.UserName, loginViewModel.Password, loginViewModel.RememberMe, false);

                if (result.Succeeded)
                {
                    return RedirectToAction("Index", "home");
                }

                ModelState.AddModelError(string.Empty, "Invalid Login Attempt");
            }
            return View(loginViewModel);
        }

        [HttpPost]
        public async Task<IActionResult> Logout()
        {
            await _signInManager.SignOutAsync();
            return RedirectToAction("index", "home");
        }

Bir yanıt yazın Yanıtı iptal et