Ce sujet c'est comment gérer les autorisations au sein des applications ASP.NET Core ? Pour l'instant je connais deux mécanismes :
Dans le Startup.cs l'Authorise policy, exemple :
// Usage : [Authorize(Policy = "AdminPolicy")]
services.AddAuthorization( options => {
options.AddPolicy( "AdminPolicy",
builder => builder.RequireRole( Roles.Admin ) );
} );
Et dans le code, aller chercher une Claim de l'utilisateur mais c'est pas mal de code. Par exemple, mon Utilisateur possède un bool IsAdmin que je suis le seul à gérer (oui, j'ai fait comme ça) si je veux aller tester dans mon code ce bool pour savoir si j’octroie les droits ou non à l'utilisateur d'effectuer l'action.
Dans le contrôleur de l'action, voici le code :
public class RoleController : Controller
{
private UserManager<ApplicationUser> userManager;
public RoleController( UserManager<ApplicationUser> userManager )
{
this.userManager = userManager;
}
[HttpPost]
public async Task<IActionResult> Delete( string id )
{
var user = await userManager.GetUserAsync( User );
if ( user.IsAdmin == false )
{
return RedirectToAction( nameof( HomeController.ErrorUserIsNotSuperAdmin ), "Home" );
}
Mais bon, je ne vais pas écrire ce code pour tout les composants de mon application qui ont besoin de savoir de quel utilisateur il s'agit pour octroyer ou non les actions, ce serait fastidieux et rébarbatif.
Note de l'auteur (moi) : Au passage je réponds à une question souvent posé dans la StackOverflow :
stackoverflow - How to get current user in asp.net core
Curieux de voir à quel point cette communauté se perd elle même. Ils manquent de modérateurs à mon goût pour supprimer les mauvaises réponses car ils ne trouve pas de réponse correcte à des questions pourtant toutes simples. Peut être que c'est l'indexation de googoole qui le mets dans le vent...
Du coût je regarde la définition de RequireRole et juste à côté je remarque le définition de RequireAssertion alors ma chaine de recherche devient :
ASP.NET Core Authorize Policy Requires Assertion example
Et je tombe sur la bonne page :
MSDN - Policy-based authorization in ASP.NET Core
Et je tombe là dessus :
[Authorize(Roles = "Administrator")]
Grrrr ! Je conserve quand même mon AdminPolicy qui est plus facile à faire évoluer et qui est un bon exemple si je souhaite évoluer. Et finalement ce que je veux faire, peut se faire simplement par :
services.AddAuthorization(options =>
{
options.AddPolicy("IsSuperAdmin", policy => policy.RequireClaim( "role", "SuperAdmin"));
});
Et dans : StsIdentityServer\IdentityWithAdditionalClaimsProfileService.cs
public async Task GetProfileDataAsync( ProfileDataRequestContext context )
{
if ( user.IsAdmin )
{
claims.Add( new Claim( JwtClaimTypes.Role, "SuperAdmin" ) );
}
Le tour est joué, il ne me reste plus qu'à tester.
Développez des Applications Web avec ASP.NET en langage C#. Etudier les modèles MVC, Angular, JavaScript, CSS, HTML
Affichage des articles dont le libellé est Authentification. Afficher tous les articles
Affichage des articles dont le libellé est Authentification. Afficher tous les articles
jeudi 9 juillet 2020
vendredi 5 juin 2020
Authentification dans les applications Angular
Tout commence par l'intégration des boutons Signin et Register dans l'application Angular. J'ai créé un template d'application ASP.NET Core Angular par la commande suivante :
>dotnet new angular -o .\AspNetCoreAuthAngular -au Individual
J'étudie deux applications ; mon template et l'application suivante Asp.Net Core & IdentityServer
FullStackMark - User Authentication and Identity with Angular, Asp.Net Core and IdentityServer
Tout commence par le Bouton Login et lui, Mark ne s'embête pas, il le met dans une page tout seul et il s'appelle : Login with IdentityServer
Mais moi, je souhaite utiliser SmartAdmin comme architecture de mon application Angular. Et donc tout là haut, à droite, il y a un bouton SignIn derrière l'icône suivante :
C'est là que j'aimerais bien mettre mon code d'authentification. Mais derrière le bouton de Mark, il y a le tag suivant :
<button class="btn btn-lg btn-primary" (click)="login()">Login with IdentityServer</button>
Dans le fichier :
\AngularASPNETCoreOAuth\src\Spa\oauth-client\src\app\account\login\login.component.html
Alors que mon Icône de la SmartAdmin se trouve dans le fichier :
\DataMonitoring\ClientApp\src\app\shared\layout\user\logout\logout.component.html
Pour FullStackMark, j'arrive dans le code TS et je trouve un module 'ngx-spinner' qui est installé dans les node_modules.
Alors c'est quoi le module ngx-spinner ? Juste un module qui permet l'attente, l'attente de la demande d'authentification au Server en assombrissant l'écran.
damienbod/angular-auth-oidc-client
https://github.com/damienbod/AspNet5IdentityServerAngularImplicitFlow
Et puis il y a un deuxième projet :
IdentityModel/oidc-client-js
Alors c'est lequel le meilleur ?
StsIdentityServer unauthorized_client
Refused to frame because an ancestor violates the following Content Security Policy directive: "frame-ancestors 'self'".
IdentityServer4 and CORS policy
Angular 8 - Tutoriel et exemple sur l'enregistrement et l'authentification des utilisateurs
En fait le FakeBackEnds n'est pas représentatif de la réalité, pas représentatif de IdentityServer4, par exemple l'authentification se fait en regardant si l'utilisateur et le mot de passe correspondent dans la base de données ... c'est pas super sécur cela ne respecte pas le processus oidc ...
C'est l'exemple parfait extrêmement bien documenté.
Voilà c'est fini, nous savons maintenant comment implémenter les autorisations de navigation au sein de notre application Angular et nous avons trouvé la bonne documentation.
Have fun!
>dotnet new angular -o .\AspNetCoreAuthAngular -au Individual
J'étudie deux applications ; mon template et l'application suivante Asp.Net Core & IdentityServer
FullStackMark - User Authentication and Identity with Angular, Asp.Net Core and IdentityServer
Tout commence par le Bouton Login et lui, Mark ne s'embête pas, il le met dans une page tout seul et il s'appelle : Login with IdentityServer
Mais moi, je souhaite utiliser SmartAdmin comme architecture de mon application Angular. Et donc tout là haut, à droite, il y a un bouton SignIn derrière l'icône suivante :
![]() |
| fa-sign-in |
C'est là que j'aimerais bien mettre mon code d'authentification. Mais derrière le bouton de Mark, il y a le tag suivant :
<button class="btn btn-lg btn-primary" (click)="login()">Login with IdentityServer</button>
Dans le fichier :
\AngularASPNETCoreOAuth\src\Spa\oauth-client\src\app\account\login\login.component.html
Alors que mon Icône de la SmartAdmin se trouve dans le fichier :
\DataMonitoring\ClientApp\src\app\shared\layout\user\logout\logout.component.html
Pour FullStackMark, j'arrive dans le code TS et je trouve un module 'ngx-spinner' qui est installé dans les node_modules.
Alors c'est quoi le module ngx-spinner ? Juste un module qui permet l'attente, l'attente de la demande d'authentification au Server en assombrissant l'écran.
Authentification dans les applications Angular - SmartAdmin
LoginComponentdamienbod/angular-auth-oidc-client
https://github.com/damienbod/AspNet5IdentityServerAngularImplicitFlow
Et puis il y a un deuxième projet :
IdentityModel/oidc-client-js
Alors c'est lequel le meilleur ?
StsIdentityServer unauthorized_client
Refused to frame because an ancestor violates the following Content Security Policy directive: "frame-ancestors 'self'".
IdentityServer4 and CORS policy
Partie cliente avec Angular
Le meilleur c'est Jason WatmoreAngular 8 - Tutoriel et exemple sur l'enregistrement et l'authentification des utilisateurs
En fait le FakeBackEnds n'est pas représentatif de la réalité, pas représentatif de IdentityServer4, par exemple l'authentification se fait en regardant si l'utilisateur et le mot de passe correspondent dans la base de données ... c'est pas super sécur cela ne respecte pas le processus oidc ...
Authentification Guards Angular
Mon sujet est réellement celui là. Avec une présentation complète et bien documentée Ici :
Mais on va vite vers l'achat du bouquin c'est bien mais je n'ai pas le temps.
- CanActivate
- CanActivateChild
- CanDeactivate
- CanLoad
- Resolve
Et l'article vous redirige vers : Angular Doc ou vous trouverez une définition de tous ces termes. Mais dans la pratique qu'est ce que j'implémente dans mon application angular ?
Alors je poursuis par Ici :
Mais tout de suite vous êtes redirigé un ailleurs, vers plus de sécurité, Ici :
Mais là on s'écarte peut être un peu du sujet en tous cas on élargit avec les API REST. Cet article est une véritable SOMME en matière de présentation de l'authentification dans les réseaux. A lire absolument.
Alors la meilleur façon de faire, c'est de prendre la superbe Documentation Angular et de chercher les bons chapitres.
Comme le chapitre suivant :
![]() |
| Router tutorial overview |
et de poursuivre un peu plus loin avec le tutorial :
C'est l'exemple parfait extrêmement bien documenté.
Voilà c'est fini, nous savons maintenant comment implémenter les autorisations de navigation au sein de notre application Angular et nous avons trouvé la bonne documentation.
Have fun!
mardi 24 mars 2020
ASP.NET Core comparaison des structures des Bases de données avec IdentityServer
Sur quoi doit-on baser l'authentification d'une application web ASP.NET Core ? Quelle structure pour la base de données AspNet ? C'est un vieux sujet, remis au gout du jour par le développement des nouvelles applications ASP.NET Core. Ce sujet est vieux comme les applications web mais nous devons adapter les anciennes structures aux nouvelles possibilités de connexions.
Quand j'instancie une Application Templates ASP.NET Core Authentification :
Qu'est ce que j'ai en définitive ?
Je trouve curieux, j'exécute l'application, je cherche à me m'enregistrer on me dit Register mais je ne trouve pas cette page, ni cette vue :
Après je m'attèle à un peu de lecture ici :
INFINITES BLOGS - Implémenter IdentityServer 4 dans une application ASP.NET Core 2.2
Et de mon côté, je vous donne la structure de la BD que j'ai trouvé sur un exemple probant d'implémentation d'IdentityServer :
https://github.com/Deblokt/IdentityServer4Demos.NETCore31
Manifestement ce projet est issu de IdentityServer
IdentityServer - The Identity and Access Control solution that works for you
Plutôt complet, non ? Trop peut être comment faire que choisir quelle structure pour ce que je veux faire ...
Je poursuis la découverte de mon exemple Template de base car j'aime bien connaitre déjà ce que l'on nous propose comme standard.
Je déroule le processus d'enregistrement car je sais que c'est à ce moment que la Base de Données d'Indentification est créée et cette BD n'est pas encore créée sur ma machine de développement.
L'application me propose un bouton Apply Migrations qui avec un peu de code, va tout faire ...
Et ensuite, je suis Welcome dans l'application avec la possibilité de confirmer mon compte.
Je prends note de tout ça car c'est drôlement bien fait ! Presque fascinant pour une dev comme moi qui est vécu les premières version d'ASP.NET et quand je pense au boulot et au code qu'il fallait mettre en œuvre à l'époque.
Alors que là, tout est à portée de clique.
Voilà la structure de la base qui a été créée :
Et nous n'avons pas encore intégré IndentityServer dans ce projet. Pour poursuivre je propose de regarder du côté du Scaffolding mais qu'est ce que c'est que ça ?
Et bien avec mon Visual Studio je fais bouton droit au niveau du projet :
Projet->bouton droit->Add->New Scaffolded Item ...
New Scaffolded Item -> Identity
Et là, un monde s'ouvre à vous ...
Je choisi simplement Account\Register alors que je pensais que j'étais déjà passé par cette page car je me suis enregistré donc où était le formulaire d'enregistrement dans l'application... Je trouve cela pour le moins Curieux.
Je fais les choix suivants pour le Data Context et la User Class
Avec tout ça, qu'est ce j'ai ... Avant toute cette opération j'ai eu le bon goût de sauvegarder une version de référence pour voir ce que Visual Studio Template à créé dans ma nouvelle application. C'est une méthode que vous pouvez employer lorsque vous travaillez avec Visual Studio Template de garde une référence.
C'est très enrichissant de pouvoir constater, observer ce que Visual a créé pour nous. Je vous le livre tel quel mais sachez que c'est une bonne façon de travailler. Il faut bien connaitre le Template c'est une façon de se faire une culture des références pour aller regarder ce que les autres ont fait.
Alors me direz-vous, que vient faire IdentityServer là dedans et bien ce sera le sujet du prochain post ... Identity vs IndentityServer.
Un peu de lecture sur ce sujet :
StackOverflow - .NET Core IndentityServer4 vs Indentity Authentification
Alors qu'en fait la question n'est pas de les comparer car Identity c'est tout simplement une table de Users alors qu'IdentityServer est un système bien plus large permettant l'authentification et l'autorisation de multiples applications accédant à de multiple APIs.
MSDN - Authentication and authorization for SPAs
Authentication and authorization for SPAs (Single Page Application) ASP.NET Core Identity for authenticating and storing users is combined with IdentityServer for implementing Open ID Connect.
Ici les deux sont combinés.
To Be Co
Quand j'instancie une Application Templates ASP.NET Core Authentification :
![]() |
| ASP.NET Core MVC Authentification by Individual User Accounts |
Qu'est ce que j'ai en définitive ?
![]() |
| ASP.NET Core MVC Authentification by Individual User Accounts |
![]() |
| ASP.NET Core Individual Authenification |
INFINITES BLOGS - Implémenter IdentityServer 4 dans une application ASP.NET Core 2.2
Et de mon côté, je vous donne la structure de la BD que j'ai trouvé sur un exemple probant d'implémentation d'IdentityServer :
https://github.com/Deblokt/IdentityServer4Demos.NETCore31
![]() |
| Structure de la Base de Données pour une Application IdentityServer |
Manifestement ce projet est issu de IdentityServer
IdentityServer - The Identity and Access Control solution that works for you
Plutôt complet, non ? Trop peut être comment faire que choisir quelle structure pour ce que je veux faire ...
Je poursuis la découverte de mon exemple Template de base car j'aime bien connaitre déjà ce que l'on nous propose comme standard.
Je déroule le processus d'enregistrement car je sais que c'est à ce moment que la Base de Données d'Indentification est créée et cette BD n'est pas encore créée sur ma machine de développement.
![]() |
| Apply Migrations |
L'application me propose un bouton Apply Migrations qui avec un peu de code, va tout faire ...
![]() |
| Migration Applied |
![]() |
| Confirmer mon enregistrement |
Alors que là, tout est à portée de clique.
![]() |
| Welcome Home sweet home |
Voilà la structure de la base qui a été créée :
![]() |
| ASP.NET Core Identity |
Et bien avec mon Visual Studio je fais bouton droit au niveau du projet :
Projet->bouton droit->Add->New Scaffolded Item ...
![]() |
| Projet->bouton droit->Add->New Scaffolded Item ... |
![]() |
| New Scaffolded Item -> Identity |
![]() |
| Scaffolded Identity |
![]() |
| Data context class |
![]() |
| Ajouter une légende |
C'est très enrichissant de pouvoir constater, observer ce que Visual a créé pour nous. Je vous le livre tel quel mais sachez que c'est une bonne façon de travailler. Il faut bien connaitre le Template c'est une façon de se faire une culture des références pour aller regarder ce que les autres ont fait.
![]() |
| Item Sacffolded -> Account\Register |
Un peu de lecture sur ce sujet :
StackOverflow - .NET Core IndentityServer4 vs Indentity Authentification
Alors qu'en fait la question n'est pas de les comparer car Identity c'est tout simplement une table de Users alors qu'IdentityServer est un système bien plus large permettant l'authentification et l'autorisation de multiples applications accédant à de multiple APIs.
MSDN - Authentication and authorization for SPAs
Authentication and authorization for SPAs (Single Page Application) ASP.NET Core Identity for authenticating and storing users is combined with IdentityServer for implementing Open ID Connect.
Ici les deux sont combinés.
To Be Co
lundi 16 mars 2020
Authentification dans les Applications ASP.NET Core & Angular
C'est très important pour une Application Web d'intégrer le bon module d'authentification. Toute Application Web est destinée à être installée en ligne et à permettre aux utilisateurs de venir se connecter, créer un profile et gérer ce profile qui leur donnera accès aux différentes partie de l'application auxquelles ils seront autorisés.
C'est l'objectif fonctionnel du LoginModule à l'époque (mais aucune trace du LoginModule mabyre n'a pas souhaité la sauvegarder car c'est obsolète) aujourd'hui je vais actualiser mes connaissances en utilisant ASP.NET Core et Angular. Pour ce faire, facile je pars du Template d'application proposé par Visual Studio et je regarde la partie Authentification.
Microsoft - Facebook, Google, and external provider authentication in ASP.NET Core
Ce didacticiel montre comment créer une application ASP.NET Core 3.0 qui permet aux utilisateurs de se connecter à l'aide d'OAuth 2.0 avec des informations d'identification de fournisseurs d'authentification externes.
Voilà le mot clef que l'on retrouve asse souvent maintenant c'est OAuth. C'est assez énorme et c'est cela qu'il faut utiliser.
Alors je créé une application Web ASP.NET Core 3.0 & Angular j'exécute et je me retrouve que la page d'enregistrement d'un nouvel utilisateur :
Tout est là pour m'enregistrer et accéder aux pages réservées de cette application que j'ai appelé WebApplicationAuthen.
Je m'enregistre et j'accède à la prochaine page, celle qui est authorisée aux utilisateurs authentifiés :
Je vous livre mes impressions, franchement c'est super bien fait ! Il y a tout et le tout en TypeScript avec Angular. Je vais donc lire la doc pour installer un "server de mail" afin de l'utiliser pour la confirmation d'enregistrement :
Microsoft.NET - Account confirmation and password recovery in ASP.NET Core
Je clique sur la confirmation pour confirmer la création de mon compte et me voici authentifié :
WebApplicationAuthen\WebApplicationAuthen\appsettings.json
"ConnectionStrings": {
"DefaultConnection": "Server=(localdb)\\mssqllocaldb;Database=aspnet-WebApplicationAuthen-53bc9b9d-9d6a-45d4-8429-2a2761773502;Trusted_Connection=True;MultipleActiveResultSets=true"
},
Pour avoir un vue du mssqllocaldb avec Visual Studio je dois aller dans :
Et puis je fais bouton droit propriété :
Pour me rendre compte que la base est dans le répertoire :
C:\Users\UserName\aspnet-WebApplicationAuthen-53bc9b9d-9d6a-45d4-8429-2a2761773502.mdf
Pour une clef dans le nom de la base ? Pour des raisons de sécurité ainsi son nom est moins facile à deviner.
AspNetRoleClaims
AspNetRoles
AspNetRoleUserClaims
AspNetRoleUserLogins
AspNetRoleUserRoles
AspNetRoleUsers
Voilà la bonne surprise est que tout cela n'est que du classique de l'ASP.NET DB de l'époque des premières versions ASPX ou l'on a toutes les applications pour créer des groupes d'authentification de pouvoir ajouter des Users dans ces groupes ou de les retirer afin d'attribuer des rôles ou de les retirer.
CQFD !
C'est l'objectif fonctionnel du LoginModule à l'époque (mais aucune trace du LoginModule mabyre n'a pas souhaité la sauvegarder car c'est obsolète) aujourd'hui je vais actualiser mes connaissances en utilisant ASP.NET Core et Angular. Pour ce faire, facile je pars du Template d'application proposé par Visual Studio et je regarde la partie Authentification.
Microsoft - Facebook, Google, and external provider authentication in ASP.NET Core
Ce didacticiel montre comment créer une application ASP.NET Core 3.0 qui permet aux utilisateurs de se connecter à l'aide d'OAuth 2.0 avec des informations d'identification de fournisseurs d'authentification externes.
Voilà le mot clef que l'on retrouve asse souvent maintenant c'est OAuth. C'est assez énorme et c'est cela qu'il faut utiliser.
Alors je créé une application Web ASP.NET Core 3.0 & Angular j'exécute et je me retrouve que la page d'enregistrement d'un nouvel utilisateur :
![]() |
| Authentification avec ASP.NET Core & Angular |
Tout est là pour m'enregistrer et accéder aux pages réservées de cette application que j'ai appelé WebApplicationAuthen.
Je m'enregistre et j'accède à la prochaine page, celle qui est authorisée aux utilisateurs authentifiés :
![]() |
| Authentification avec ASP.NET Core & Angular - Enregistrement |
Microsoft.NET - Account confirmation and password recovery in ASP.NET Core
Je clique sur la confirmation pour confirmer la création de mon compte et me voici authentifié :
![]() |
| Authentification avec ASP.NET Core & Angular - Authentification |
Savoir où est la base de données ?
Je cherche la chaine de connexion dans :WebApplicationAuthen\WebApplicationAuthen\appsettings.json
"ConnectionStrings": {
"DefaultConnection": "Server=(localdb)\\mssqllocaldb;Database=aspnet-WebApplicationAuthen-53bc9b9d-9d6a-45d4-8429-2a2761773502;Trusted_Connection=True;MultipleActiveResultSets=true"
},
Pour avoir un vue du mssqllocaldb avec Visual Studio je dois aller dans :
![]() |
| Visual Studio - SQL Server Object Explorer - Où est la base ? |
![]() |
| Visual Studio - SQL Server Object Explorer - Où est la base ? |
C:\Users\UserName\aspnet-WebApplicationAuthen-53bc9b9d-9d6a-45d4-8429-2a2761773502.mdf
Pour une clef dans le nom de la base ? Pour des raisons de sécurité ainsi son nom est moins facile à deviner.
Que trouve t-on dans cette base ?
Des Tables bien sûr, les suivantes :AspNetRoleClaims
AspNetRoles
AspNetRoleUserClaims
AspNetRoleUserLogins
AspNetRoleUserRoles
AspNetRoleUsers
![]() |
| SQL Server ASPNET DB Tables |
CQFD !
Inscription à :
Articles (Atom)






















