2/7/2020 ASP.

NET Core - Registro de usuario - Tutorialspoint

ASP.NET Core - Registro de usuario

En este capítulo, discutiremos el registro del Usuario. Ahora tenemos una base de datos en
funcionamiento, y es hora de comenzar a agregar algunas de las funciones a la aplicación.
También hemos configurado nuestra aplicación y tenemos un esquema de base de datos en
funcionamiento. Pasemos ahora a la página de inicio de la aplicación.

Abra las herramientas de desarrollador presionando F12 y luego haga clic en el enlace Editar.
Anteriormente, cuando hacíamos clic en el enlace Editar, el marco MVC detectó la presencia
del atributo Autorizar y devolvió un código de estado 401 porque el usuario no había iniciado
sesión.

Ahora verá que recibimos un mensaje en la pantalla del archivo de configuración.

Pasemos ahora a las herramientas de desarrollador.

https://www.tutorialspoint.com/asp.net_core/asp.net_core_user_registration.htm 1/7
2/7/2020 ASP.NET Core - Registro de usuario - Tutorialspoint

Verá que el navegador solicitó la página de edición, y el marco MVC decidió que el
usuario no está autorizado para ver este recurso.
Entonces, en algún lugar dentro del marco MVC, se generó un código de estado 401.
Ahora tenemos el middleware Identity en su lugar. El middleware de Identity analiza el
código de estado 401 que se enviará al usuario y lo reemplaza con un código de
estado 302, que es un código de estado de redireccionamiento.
The Identity framework knows that the user will have to try to log in before it can reach
this resource.
The Identity framework directed us to this URL, as we can see in the address bar —
/Account/Login.

This is a configurable endpoint with the Identity framework, inside the Startup when you
are registering these services and the middleware. There are different options you can
set and one of the options is to change the login URL.
By default, the URL is going to be /Account/Login. Currently, we don't have an account
controller, so ultimately what we want to do is to create an account controller and allow
a user to log in.
But before the users can even log in, they will need to register on the site and save their
usernames and a passwords.
Both the login and the register features can be part of an account controller.
Let us now move ahead and add a new class in Controllers folder, and call it the
AccountController. We will derive this from the MVC framework base Controller class.

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 {
https://www.tutorialspoint.com/asp.net_core/asp.net_core_user_registration.htm 2/7
2/7/2020 ASP.NET Core - Registro de usuario - Tutorialspoint

}
}

We will now have to set up a feature where a user can register for this site.

It is going to be very much like an edit form.

When the user wants to register, we will first display a form that allows them to fill the
required information. They can then upload this form to the site.
This information is then saved on the database.
Let us now create the action that will return a view when we go to /account/register.

public class AccountController : Controller {

[HttpGet]
public ViewResult Register() {
return View();
}
}

We don't need to look anything up, the user will provide all the information that we need. Before
we build the ViewModel for that view, we need to decide on the information that the view will
display. We also need to decide on the information that we will need to receive from the user?
Let us create a view model for this scenario by adding a new class in the AccountController.cs
file and call this the RegisterViewModel.
Let us create some properties that will hold the Username, Password and also the user
ConfirmPassword by typing it twice and making sure that both passwords match as shown in
the following program.

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; }
}

In the above class, you can see some annotations that can help us validate this model. The
username is required here and if you look at the database schema, the column to hold a
username is 256 characters long.

https://www.tutorialspoint.com/asp.net_core/asp.net_core_user_registration.htm 3/7
2/7/2020 ASP.NET Core - Registro de usuario - Tutorialspoint

We will also apply a MaxLength attribute here.

A password is going to be required, and when we render an input for this password, we
want the input type to be of Type Password so that the characters don't display on the
screen.
The Confirm Password is also going to be the DataType Password and then there is
an additional Compare attribute. We will compare the ConfirmPassword field with this
other property that we can specify, which is the Password field.

Let us now create the view that we need. We will need to add a new folder to the views and call
it Account, so all of the views related to the AccountController will be added in this folder.

https://www.tutorialspoint.com/asp.net_core/asp.net_core_user_registration.htm 4/7
2/7/2020 ASP.NET Core - Registro de usuario - Tutorialspoint

Now, right-click on the Account folder and select Add → New Item.

In the middle pane, select the MVC View Page and call it Register.cshtml and then Click on the
Add button.
Delete all the existing codes from the Register.cshtml file and add the following code.

@model RegisterViewModel
@{
https://www.tutorialspoint.com/asp.net_core/asp.net_core_user_registration.htm 5/7
2/7/2020 ASP.NET Core - Registro de usuario - Tutorialspoint

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>

You can now see that we have specified the model as the RegisterViewModel that we
have just created.
We will also set the title for this page using the ViewBag and we want the title to be
Register.
We also need to create a form which contains the fields for Username, Password and
ConfirmPassword.

We have also included a div that will display a validation summary. When we use the
ASP validation summary, we need to specify what errors are to appear in the summary.
We can have all the errors appear in the summary area, or we can say
ValidationSummary.ModelOnly and the only errors that will appear from the model
validation inside the summary will be the validation errors that are associated with the
model and not a specific property of that model.
In other words, if the users do not fill out their username, but the username is required,
and there will be a validation error for that specific property.

https://www.tutorialspoint.com/asp.net_core/asp.net_core_user_registration.htm 6/7
2/7/2020 ASP.NET Core - Registro de usuario - Tutorialspoint

But you can also generate model errors that are not associated with a specific property
and they will appear in this ValidationSummary.

Inside a <form> tag we have labels and inputs for all of the different fields that we have
in our ViewModel.
We need a label for the Username, an input for the Username and also validation
messages for the Username.

The other two properties that we need the user to enter are same and that will have a
label and input and a span for the Password and a label and an input and a span for
ConfirmPassword.
We don't need to specify the input types for the Password and ConfirmPassword,
because the asp for tag helper will make sure to set that input type as a password for
us.
At the end, we need to have the button that says Register. When the user clicks on this
button, we will submit the form back to the controller.
In the AccountController, we also need to implement an HttpPost Register action method. Let us
go back to the AccountController and add the following Register action as follows −

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

Este método de acción devolverá un IActionResult. Esto recibirá un RegisterViewModel. Ahora,

necesitamos interactuar con el marco de Identidad para asegurarnos de que el usuario sea
válido, decirle al marco de Identidad que cree ese usuario, y luego, ya que acaban de crear la
cuenta, continúe e inicie sesión. Veremos implementando todos estos pasos en el próximo
capítulo.

https://www.tutorialspoint.com/asp.net_core/asp.net_core_user_registration.htm 7/7