Configuración de Modelo Personalizado de Login por Usuario y

Contraseña
En este artículo, voy a demostrar cómo cambiar la configuración de identificación de
seguridad en ASP.NET que viene con la plantilla MVC por defecto utilizando un simple
nombre de usuario en lugar del correo electrónico.

Cambiando el LoginViewModel
Modificar el modelo “AccountViewModels.cs” ubicado en la carpeta “Models” de nuestro
proyecto.

Aquí, es necesario cambiar la propiedad Email por Username y también eliminar el atributo
[EmailAddress], de lo contrario nuestra vista esperará un correo electrónico en lugar de un
nombre de usuario. Concretando, al final debemos tener algo como esto:

public class LoginViewModel

{
[Required]
[Display(Name = "Usuario")]
public string UserName { get; set; }

[Required]
[DataType(DataType.Password)]
[Display(Name = "Password")]
public string Password { get; set; }

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

Cambiando el RegisterViewModel

También tenemos que cambiar el modelo de la vista del registro. Aquí no borraremos nada,
pero tendremos que añadir una nueva propiedad llamada UserName, el resultado debería
ser algo así:

public class RegisterViewModel

{
[Required]
[EmailAddress]
[Display(Name = "Email")]
public string Email { get; set; }

[Required]
[Display(Name = "Usuario")]
public string UserName { get; set; }

[Required]
 [StringLength(100, ErrorMessage =
"El {0} debe contener al menos {2} caracteres.", MinimumLength = 6)]
[DataType(DataType.Password)]
[Display(Name = "Password")]
public string Password { get; set; }

[DataType(DataType.Password)]
[Display(Name = "Confirmar password")]
[Compare("Password", ErrorMessage =
"El password y la confirmacion del password no coinciden.")]
public string ConfirmPassword { get; set; }
}

Cambiando el ForgotPasswordViewModel
También necesitamos cambiar el modelo de la vista de Olvidó su contraseña y cambiarlo
por UserName, ya que si se echa un vistazo a la acción ForgotPassword en el controlador
del Account, se ve que utiliza el correo electrónico para encontrar al usuario. Tendremos
campos diferentes para el nombre de usuario y para el correo ahora, lo que obtendremos
finalmente es:

public class ForgotPasswordViewModel

{
[Required]
[Display(Name = "Usuario")]
public string UserName { get; set; }
}

Cambiando el ResetPasswordViewModel
Tenemos que hacer lo mismo que antes para la vista del reseteo de contraseñas también,
el motivo es el mismo que el caso de olvidé mi contraseña. Nuestra vista modelo debería
tener este aspecto:

public class ResetPasswordViewModel

{
[Required]
[Display(Name = "Usuario")]
public string UserName { get; set; }

[Required]
[StringLength(100, ErrorMessage =
"La {0} debe contener al menos {2} caracteres.", MinimumLength = 6)]
[DataType(DataType.Password)]
[Display(Name = "Password")]
public string Password { get; set; }

[DataType(DataType.Password)]
[Display(Name = "Confirmar password")]
[Compare("Password", ErrorMessage =
"El password y la confirmacion del password no coinciden.")]
public string ConfirmPassword { get; set; }
 public string Code { get; set; }
}

Cambiando la acción del Login

Debemos modificar la acción del “Post Login” del archivo “AccountController” ubicado
en la carpeta “Controller”.

Tan sólo hay que cambiar una línea aquí, la línea que pasa el email para
PasswordSignInAsync. Tenemos que cambiar el correo electrónico por el nombre de
usuario, así:

var result = await SignInManager.PasswordSignInAsync(

model.UserName, model.Password, model.RememberMe, shouldLockout:
false);

Cambiando la acción del Register

Aquí, tendremos que cambiar la línea que crea un nuevo ApplicationUser y pasa el
UserName por el Username en el constructor, en lugar del correo electrónico, de este modo:

var user = new ApplicationUser { UserName = model.UserName, Email = model.Ema

il };

Cambiando la acción del ForgotPassword

Tenemos que cambiar la acción del Olvidó su contraseña de este modo:

var user = await UserManager.FindByNameAsync(model.UserName);

Cambiando la acción del ResetPassword

La última acción que debemos cambiar es la de ResetPassword, tal que así:

var user = await UserManager.FindByNameAsync(model.UserName);

También existen otros métodos como ExternalLoginConfirmation que utilizan el correo

electrónico por el nombre de usuario el cual se puede cambiar, pero aquí no lo vamos a
utilizar.
Cambiando las vistas del Register, Login, ForgotPassword,
ResetPassword
Se debe modificar la vista “Login.cshtml”, ubicada en el “Views -> Account”.
Todo lo que necesitamos hacer ahora es cambiar el correo electrónico en el LabelFor y en
el TextBoxFor en estas vistas. Ten en cuenta que tenemos que añadir un nuevo cuadro de
texto en el registro de la vista, para coger el nombre de usuario del usuario, además del e-
mail:

@Html.LabelFor(m => m.UserName, new { @class = "col-md-2 control-label" })

@Html.TextBoxFor(m => m.UserName, new { @class = "form-control" })

@Html.LabelFor(m => m.Email, new { @class = "col-md-2 control-label" })

@Html.TextBoxFor(m => m.Email, new { @class = "form-control" })

Eso es todo lo que necesitamos hacer para cambiar la plantilla predeterminada MVC y
utilizar el UserName en lugar del Email.