Autenticación y autorización en: Blazor.

Primero que nada, disculpa por tener este lugar tan lleno de polvo, así que hola muy buenas a todos los que estáis leyendo esta entrada, vengo a desempolvar y tal y como dice en el título vengo a explicar lo que es la autorización y la autenticación en el framework de .NET: Blazor.

Bien, creo que es conveniente saber primero saber lo que es exactamente la autenticación y la autorización en una aplicación en general, así que aquí yo os dejaré la descripción de ambos conceptos usando mis palabras:

• Autenticación: La autenticación es el proceso de inicio de sesión de un usuario y que al mismo tiempo ayuda a identificarlo. Básicamente, lo necesitamos para saber quién es el usuario que ha iniciado sesión.
• Autorización: Es el proceso de identificar si un usuario tiene permisos para realizar una acción dentro de la aplicación web (editar o borrar una publicación, por ejemplo.

Una vez explicado ambos conceptos, ¿cómo se trabaja en Blazor? pues a decir verdad se puede trabajar de varias formas, ¿no suelen decir que la programación tiene numerosos caminos? intentaré explicarlo de la mejor forma posible y de los caminos que se suelen tomar, yo por ejemplo para mi primera aplicación blazor opté por el camino siguiente:

Bueno, en nuestra aplicación tendríamos ya desarrollado la interfaz de nuestro formulario para el inicio de sesión y podríamos guardar el nombre del usuario y el rol que va a tomar en unas variables (el rol es para la autorización, que ahora la explicaré más adelante.) 

Cuando utilicemos esas variables es cuando podemos crear una clase aparte y hacer un método como este:

UserSession es una clase donde podéis almacenar las variables para el nombre del usuario y el rol y así poder utilizarlos en los claims (están subrayados de amarillo), que por cierto, al mismo tiempo se suele desarrollar una autorización por token y así vuestra aplicación tendría más seguridad que como es obvio, Blazor también tiene su propia forma de hacerlo.

Bien, y una vez autenticado el usuario, ¿cómo comprobamos los permisos que tiene? ¿qué puede ver, qué no puede ver y qué puede hacer y no puede hacer? para ambos caminos se suelen tomar caminos diferentes y no son independientes, sino complementarios.

En blazor, solemos tener un razor llamado Navmenu, que es donde incluye todas las pestañas de navegación y normalmente cuando inicias una aplicación, ¿verdad que solamente suele aparecer la famosa pestaña de "Iniciar sesión"? y una vez te identificas ya podrías ver el resto de pestañas de navegación y así poder navegar a tu total libertad, vale, pues lo que tendríamos que hacer es lo siguiente:

Que para explicarlo más específicamente (teniendo en cuenta lo subrayado) significa lo siguiente:

<AuthorizeView Roles="Administrator">

   <Authorized>

   </Authorized>

</AuthorizeView>

AuthorizeView es la etiqueta principal y ahí es donde le podemos poner una propiedad que se llama Roles y ahí poner el nombre del rol que ha tomado el usuario al autenticarse (esto se guarda en las variables de los claims), en este caso si el username es "Administrador" optará el rol de administrador, así de sencillo así que dependiendo del rol que pongas en esa etiqueta podrá ver ese contenido, en la imagen estamos diciéndole que el administrador y el usuario normal podrá ver o no podrá ver ciertas cosas, el administrador y el usuario podrá ver la pestaña de "Counter" y sólo el administrador podrá ver la de "Fetch Data", si quisiéramos el caso contrario deberíamos sustituir las pestañas del <Authorized> por las de <Not Authorized>, y así es como se gestionaría la autorización en las pestañas de navegación del Blazor.

IMPORTANTE: Para que esto funcione debemos poner las etiquetas de <CascadingAuthenticationState> en nuestra clase App.razor:

Para hacerlo con los típicos razor que solemos tener en pages es tan sencillo como poner en la parte más superior de tus razor (donde se incluyen los using y demás) lo siguiente:

[Authorize(Roles="Administrador"]

Y todo esto es llamado autorización basada en roles, también se suele hacer la autorización basada en políticas. 

Por último para explicar, ya sabemos cómo hacer para que el usuario pueda ver o no pueda ver ciertas cosas de la aplicación, ¿qué debemos hacer entonces en el caso de que pueda o no pueda hacer ciertas cosas? Por ejemplo, tenemos una tabla para poder gestionar una administración y en esa tabla tenemos las opciones de eliminar, editar o agregar una nueva información, ¿cómo podemos que un usuario no tenga permisos para hacerte ese tipo de cosas?

Este tema también se puede hacer de diferentes medios pero tal cual como lo hice yo la primera vez es llamado la "Autorización basada en recursos de Blazor", que básicamente consta en lo siguiente:

Yo lo hice de un modo un poco más complejo realizando una clase aparte y que si coincidía ciertos aspectos de mi usuario podría o no podría editar pero lo primerito que nada y de una forma sencilla (teniendo en cuenta los roles) es que os centréis en vuestros controladores donde tenéis los métodos para realizar las llamadas al API, básicamente para hacer que borre, edite y agregue vuestros datos (almacenados por supuesto en vuestra BBDD), pues dentro de esos métodos debéis poner lo siguiente:

Como veis, con unos ifs sencillos estaría hecho, en esa foto se puede ver que si el usuario es admin podría hacer X, en cambio si es un usuario normal podría hacer Y, dentro de esos ifs sería tan simple como poner la parte de vuestro código donde justo hacer la llamada a la api.

Y con todo esto explicado yo creo que ya se podría dar por finalizada la entrada, espero que no sólo os haya gustado sino también parecido interesante. Ojalá sirva también de ayuda, sobre todo para aquellos que están programando en .NET y quieren adentrarse a programar con este framework.