ASP .NET Core 3.1 - Usando o Identity de cabo a rabo

ASP .NET Core 3.1 - Usando o Identity de cabo a rabo - III

Hoje vamos continuar a série de artigos mostrando como usar o ASP .NET Core Identiy na versão 3.1 da ASP .NET .Core e do EF Core.

Continuando a segunda parte do artigo veremos como registrar um usuário usando o Identity.

Para poder registrar um novo usuário precisamos criar um modelo de dominio para tratar as informações do usuário e também criar a respectiva view onde o usuário vai informar suas credenciais de registro.

Vamos criar uma pasta chamada ViewModels no projeto e nesta pasta vamos criar a classe RegisterViewModel que representa o modelo para o registro contendo as propriedades para: Email, Password e ConfirmPassword:

using System.ComponentModel.DataAnnotations;

namespace FuncionariosWeb.ViewModels
{
    public class RegisterViewModel
    {
        [Required]
        [EmailAddress]
        public string Email { get; set; }

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

        [DataType(DataType.Password)]
        [Display(Name = "Confirme a senha")]
        [Compare("Password", ErrorMessage = "As senhas não conferem")]
        public string ConfirmPassword { get; set; }
    }
}

Esta classe permite transferir as informações da View para o Controller que iremos criar a seguir.

Para realizar a validação dos dados estamos usando os atributos Data Annotations nas propriedades da classe.

Nota: As ViewModels são um conceito das aplicações MVC e permitem expor informações para as Views que não estão em nosso modelo de domínio; permitem também modelar várias entidades a partir de um ou mais modelos em um único objeto.

Já temos a classe que representa o registro vamos agora criar o controlador AccountController na pasta Controllers que vai permitir coordenar as requisições para este modelo e para a sua view.

using Microsoft.AspNetCore.Mvc;

namespace FuncionariosWeb.Controllers
{
    public class AccountController : Controller
    {
        [HttpGet]
        public IActionResult Register()
        {
            return View();
        }
    }
}

Todas as operações CRUD relacionadas à conta do usuário estarão no controlador AccountController.

Inicialmente vamos apenas registrar o usuário e por isso criamos o método Action Register.

Para acessar este método Action enviamos uma requisição GET para /account/register.

Para criar a view clique com o botão direito no método Register e selecionad Add View;

Aceite o nome Register e clique no botão Add:

Nota: Inclua no arquivo _ViewImports.cshtml a referência a @using FuncionariosWeb.ViewModels.

Será criado o arquivo Register.cshtml na pasta Views/Account. Abra este arquivo e inclua o código abaixo:

@model RegisterViewModel

@{
    ViewBag.Title = "Registro de Usuário";
}
<h3>Registrar Usuário</h3>
<div class="row">
    <div class="col-md-12">
        <form method="post">
            <div asp-validation-summary="All" class="text-danger"></div>
            <div class="form-group">
                <label asp-for="Email"></label>
                <input asp-for="Email" class="form-control" />
                <span asp-validation-for="Email" class="text-danger"></span>
            </div>
            <div class="form-group">
                <label asp-for="Password"></label>
                <input asp-for="Password" class="form-control" />
                <span asp-validation-for="Password" class="text-danger"></span>
            </div>
            <div class="form-group">
                <label asp-for="ConfirmPassword"></label>
                <input asp-for="ConfirmPassword" class="form-control" />
                <span asp-validation-for="ConfirmPassword" class="text-danger"></span>
            </div>
            <button type="submit" class="btn btn-primary">Registrar</button>
        </form>
    </div>
</div>

Vamos incluir um link de acesso na barra de navegação da aplicação.

Abra o arquivo _Layout.cshtml e inclua o código abaixo:

...

 <div class="collapse navbar-collapse" id="collapsibleNavbar">
  <ul class="navbar-nav">
    <li class="nav-item">
       <a class="nav-link text-dark" asp-area="" asp-controller="Home" asp-action="Index">Home</a>
    </li>
    <li class="nav-item">
       <a class="nav-link text-dark" asp-area="" asp-controller="Funcionarios" asp-action="Index">Funcionarios</a>
     </li>
     </ul>
     <ul class="navbar-nav ml-auto">
        <li class="nav-item">
           <a class="nav-link text-dark" asp-area="" asp-controller="Account" asp-action="Register">Registrar</a>
        </li>
     </ul>
 </div>
....

Neste código eu alterei a barra de navegação para poder exibir o link para registrar à direita na barra. (Isso é apenas um detalhe de interface e fica a seu critério usar assim ou de outra forma)

Executando o projeto iremos obter o seguinte resultado:

Clicando no link Registrar iremos exibir a view Register.cshtml abaixo:

Se você tentar incluir informações e clicar no botão Registrar nada vai acontecer.

Implementamos apenas o atendimento da requisição GET e na próxima parte do artigo vamos implementar o tratamento da requisição POST quando o usuário preenche o formulário e clica em Registrar e as informações são armazenadas nas tabelas do SQL Server.

No próximo artigo veremos como tratar o HttpPost para o registro do usuário e como armazenar as informações no banco de dados.

Pegue o projeto completo aqui: IdentityTotal_Register.zip (sem as referências)

"Portanto, agora nenhuma condenação há para os que estão em Cristo Jesus, que não andam segundo a carne, mas segundo o Espírito."
Romanos 8:1

Referências:

José Carlos Macoratti