• 6 heures
  • Moyenne

Ce cours est visible gratuitement en ligne.

course.header.alt.is_certifying

J'ai tout compris !

Mis à jour le 29/03/2023

Enregistrez vos utilisateurs avec ASP.NET Identity

Créez une nouvelle application Web avec des comptes utilisateurs

Un des points forts du développement .NET réside dans la simplicité avec laquelle il est possible de créer et de gérer des comptes utilisateurs sécurisés. Pour le démontrer, nous allons créer une application disposant de comptes utilisateurs individuels sécurisés.

Ouvrez Visual Studio et procédez comme suit :

  1. Sélectionnez Fichier > Nouveau > Projet.

  2. Choisissez Application web ASP.NET Core (modèle-vue-contrôleur).

  3. Nommez le projet MonAppliSécurisée, puis cliquez sur OK.

  4. Dans la liste déroulante, assurez-vous qu'ASP.NET Core 2.1 est sélectionné.

  5. Sélectionnez Comptes individuels dans la liste des types d’authentification.

Et voilà. Visual Studio est en train de générer votre application de base. Cette application intègre un système sécurisé de gestion des comptes d'utilisateurs, qui prend notamment en charge l'inscription et la connexion. Ces comptes sont créés et gérés à l'aide d'ASP.NET Core Identity, qui est inclus dans l'application sous la forme d'une bibliothèque de classes Razor.

Maintenant que vous disposez d'une application Web fonctionnelle (oui, elle fonctionne telle quelle !), il est temps de la tester. Nous disposons déjà d'une base de données d'utilisateurs, mais elle est encore vide. Nous allons donc lui ajouter un utilisateur.

Voilà, c'est assez simple ! Bien plus simple que vous ne l'imaginiez. Exécutons l'application, et commençons par ajouter un utilisateur.

Vous devriez voir un écran semblable à celui-ci :

ASP.NET Core Identity
ASP.NET Core Identity

 Cliquez sur Register (Inscription) sur la partie droite de la barre de menu. La page d'inscription s'affiche :

Page d'inscription
Page d'inscription

Saisissez votre adresse e-mail, ajoutez un mot de passe, puis cliquez sur Register (Inscription). Avec les paramètres par défaut d'ASP.NET Core Identity, les mots de passe doivent répondre aux conditions suivantes :

  • Une longueur minimale de six (6) caractères.

  • Au moins un (1) chiffre.

  • Au moins un (1) caractère majuscule.

  • Au moins un (1) caractère minuscule.

  • Au moins un (1) caractère non alphanumérique. 

À cette étape, vous risquez de recevoir un message d'erreur comme celui-ci :

Message d'erreur
Message d'erreur

Si tel est le cas, cliquez sur le bouton Apply Migrations (Appliquer les migrations). Cette erreur indique que les migrations de données n'ont pas été appliquées à votre nouvelle base de données.

Une fois les migrations appliquées, actualisez la page. Cette action permet d'envoyer à nouveau vos identifiants d’inscription. Une fois le processus terminé, vous devriez voir une page similaire à celle-ci :

Actualisez ASP.NET Core après l'inscription
Actualisez ASP.NET Core après l'inscription

Vous remarquerez qu'il s'agit du même écran que celui que vous avez vu lorsque vous avez lancé l'application la première fois. À la place des liens Register (Inscription) et Login (Connexion) en haut à droite de la barre de menu se trouve désormais un message de bienvenue en utilisant l'adresse e-mail que vous avez saisie, ainsi qu'un lien de déconnexion. Votre compte utilisateur a maintenant bien été créé. Il est protégé par un mot de passe et stocké dans la base de données. Cliquez sur Logout (Déconnexion), puis sur Login (Connexion) et essayez de vous connecter avec vos identifiants.

Plutôt simple, n'est-ce pas ? Eh oui, vous n'avez rien à faire de plus pour créer une application disposant de comptes utilisateur individuels sécurisés avec ASP.NET Core Identity. Maintenant, pouvez-vous aller plus loin ?

Tout à fait, vous pouvez personnaliser de nombreux éléments de ce processus pour l'adapter à vos besoins. Analysons plus en détail la configuration des services fournis par ASP.NET Core Identity.

Configurez les services ASP.NET Core Identity

Dans le dossier racine de votre projet ASP.NET, vous trouverez un fichier nommé startup.cs. Il contient la classe  Startup  ainsi que les paramètres de configuration de votre application. Ce qui nous intéresse pour le moment est la méthode  ConfigureServices . C'est dans cette méthode que vous allez définir des options de configuration personnalisées pour vos services d'identité. Voici comment cette méthode se présente au départ :

public void ConfigureServices(IServiceCollection services)
{
   services.Configure<CookiePolicyOptions>(options =>
   {
      options.CheckConsentNeeded = context => true;
      options.MinimumSameSitePolicy = SameSiteMode.None;
   });

   services.AddDbContext<ApplicationDbContext>(options =>
      options.UseSqlServer(
      Configuration.GetConnectionString("DefaultConnection")));
   services.AddDefaultIdentity<IdentityUser>()
 .AddEntityFrameworkStores<ApplicationDbContext>();

   services.AddMvc()
      .SetCompatibilityVersion(CompatibilityVersion.Version_2_1);
}

C'est très bien, mais comment faire pour renforcer la sécurité en fixant une longueur et une complexité minimales pour les mots de passe des utilisateurs ? Ou encore, comment limiter le nombre de tentatives de connexion autorisées avant le verrouillage d'un compte ? Vous ne devez jamais vous contenter des valeurs de sécurité par défaut lorsque des options plus efficaces sont disponibles, et c'est justement le cas avec .NET Core.

Définissez les options de configuration d'ASP.NET Identity

En fonction des besoins de votre application, vous pouvez vouloir configurer de nombreuses options. Modifiez la méthode  ConfigureServices  pour y inclure le code suivant. Nous verrons ensuite ce que permettent ces nouvelles options.

services.Configure<IdentityOptions>(options =>
{
   // Paramètres utilisateur.
   options.User.RequireUniqueEmail = true;
   options.User.AllowedUserNameCharacters =
   "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789-._@";
   
   // Paramètres des mots de passe.
   options.Password.RequireDigit = true;
   options.Password.RequireLowercase = true;
   options.Password.RequireNonAlphanumeric = true;
   options.Password.RequireUppercase = true;
   options.Password.RequiredLength = 9;
   
   // Paramètres de verrouillage.
   options.Lockout.MaxFailedAccessAttempts = 3;
   options.Lockout.DefaultLockoutTimeSpan = TimeSpan.FromMinutes(10);
});

Dans la section de code ci-dessus, nous avons ajouté trois nouvelles catégories de paramètres de configuration : les paramètres utilisateur, les paramètres de mots de passe et les paramètres de verrouillage.

Paramètres utilisateur

Deux conditions sont appliquées aux noms d'utilisateur lors de chaque inscription :

  • Chaque adresse e-mail doit être unique. Autrement dit, une même adresse ne peut pas être associée à plusieurs comptes.

  • Il est possible d'utiliser tous les caractères alphanumériques, les minuscules et les majuscules dans les noms d'utilisateur, ainsi que les caractères   - ,  . ,  _  et  @ . Les noms d'utilisateur sont désormais limités à ces caractères. Un nom contenant le symbole du dollar ($) par exemple sera rejeté.

Paramètres des mots de passe

Dans l'extrait de code ci-dessus, cinq conditions essentielles s'appliquent à la création de tous les mots de passe des utilisateurs :

  • Tous les mots de passe doivent contenir au moins un chiffre.

  • Tous les mots de passe doivent contenir au moins une minuscule.

  • Tous les mots de passe doivent contenir au moins un caractère non alphanumérique (autrement dit, un caractère spécial comme  - ,  _ ,  ! ,  + ,  ~ , etc.).

  • Tous les mots de passe doivent contenir au moins une majuscule.

  • Tous les mots de passe doivent contenir au moins 9 caractères.

Paramètres de verrouillage

Dans l'extrait de code ci-dessus, il existe deux conditions spéciales à contrôler et à appliquer aux tentatives de connexion des utilisateurs.

  • La première fixe le nombre maximal de tentatives de connexion à 3. Cela signifie qu'après trois tentatives infructueuses, le compte de l'utilisateur sera verrouillé. 

  • La deuxième condition spécifie la durée de ce verrouillage. Dans notre cas, le compte de l'utilisateur est verrouillé pendant 10 minutes après 3 tentatives infructueuses. Passé ce délai, le compte est débloqué et l'utilisateur peut de nouveau essayer de s'y connecter.

Activez ASP.NET Identity

Vous devez activer ASP.NET Identity pour que les options de configuration soient appliquées. Pour ce faire, il suffit de placer un appel dans la méthode  Configure , qui comme la méthode  ConfigureServices  , se trouve dans startup.cs. Examinons un peu cette méthode telle qu'elle est générée par Visual Studio avec la configuration d'application par défaut.

public void Configure(IApplicationBuilder app, IHostingEnvironment env)
{
 if (env.IsDevelopment())
   {
   app.UseDeveloperExceptionPage();
      app.UseDatabaseErrorPage();
   }
   else
   {
   app.UseExceptionHandler("/Home/Error");
   app.UseHsts();
   }
   app.UseHttpsRedirection();
   app.UseStaticFiles();
   app.UseCookiePolicy();
   app.UseAuthentication();
   app.UseMvc(routes =>
   {
      routes.MapRoute(
 name: "default",
         template: "{controller=Home}/{action=Index}/{id?}"
      );
   });
}

Première chose à noter : une application .NET Core permet de configurer différents mécanismes de gestion des erreurs liés à l'environnement d'exécution. Autrement dit, vous pouvez configurer des pages d'erreur spécifiques pendant le développement qui ne seront pas utilisées une fois l'application publiée. Il est rare qu'un développeur doive modifier cette méthode, hormis pour la spécification de la route MVC par défaut. En effet, lorsque vous ne spécifiez pas de contrôleur ou d'action dans l'URL, la page d'accueil affichée par défaut est la page d'index du contrôleur HomeController. Il peut vous arriver, en votre qualité de développeur, de vouloir afficher une autre page, et c'est dans cette méthode que vous devez l'indiquer.

Mais je veux avant tout attirer votre attention sur une ligne de code bien particulière :

app.UseAuthentication();

Cette ligne constitue le point d'entrée d'ASP.NET Identity. Elle indique à l'application que vous souhaitez activer l'authentification des utilisateurs pour sécuriser les accès en utilisant les options de configuration spécifiées dans la méthode ConfigureServices. Cette ligne ajoute un middleware d'authentification au pipeline de la requête. 

Un middleware est une brique logiciel dans le pipeline de l'application servant à traiter les requêtes et les réponses. Le middleware d'authentification pour ASP.NET Identity s'assure qu'un utilisateur est authentifié avant de lui permettre d'accéder aux ressources système. Le cycle d'authentification de l'utilisateur (pipeline) se compose de trois événements distincts : l'inscription, la connexion et la déconnexion.

Comprenez les notions d'inscription, de connexion et de déconnexion des utilisateurs

Nous avons vu que l'application permet aux utilisateurs de s'inscrire et de se connecter et de se déconnecter. Toutefois, elle ne dispose pas encore des composants nécessaires permettant de personnaliser ce processus. Nous allons donc les ajouter par le biais de ce que l'on appelle le scaffolding (génération automatique de modèles).

Les versions 2.1 et ultérieures d'ASP.NET Core fournissent ASP.NET Core Identity sous la forme d'une bibliothèque de classes Razor (RCL). Les applications qui incluent Identity en appelant  app.UseAuthentication() peuvent utiliser le générateur automatique de modèles pour ajouter le code source de la bibliothèque de classes Identity Razor. Cela permet de générer du code source permettant de personnaliser le comportement de l'application. Le code généré de cette manière est prioritaire sur le code identique qui existe déjà dans la RCL Identity (code que vous avez vu en action lors de l'inscription d'un nouvel utilisateur dans votre application un peu plus tôt dans ce cours).

Bien que le générateur automatique de modèles produise la majorité du code dont vous avez besoin, il reste nécessaire de mettre à jour votre projet pour terminer le processus. Lorsque vous exécutez le générateur automatique de modèles Identity, un fichier ScaffoldingReadme.txt est créé dans le répertoire du projet. Ce fichier contient des instructions générales permettant de terminer la mise à jour.

Il existe de nombreuses façons d'exécuter le générateur automatique de modèles Identity. Dans ce cours, nous allons l’exécuter pour générer du code source ASP.NET Identity dans un projet MVC avec autorisation (type de projet créé pour ce cours). Autorisez le générateur automatique de modèles à remplacer tout le code de la RCL, et laissez-le créer une nouvelle classe de contexte de données ainsi qu'une nouvelle classe de données utilisateur pour pouvoir les étudier tranquillement.

Exécutez le générateur automatique de modèles Identity

  1. Sur la page Explorateur de solutions, faites un clic droit sur le projet (MonAppliSecurisee), puis sélectionnez Ajouter > Nouvel élément généré automatiquement...

  2. Dans la fenêtre de gauche de la boîte de dialogue Ajouter un nouvel élément généré automatiquement, sélectionnez Identité, puis cliquez sur le bouton Ajouter.

  3. Dans la boîte de dialogue Ajouter Identité :

  • Sélectionnez votre page de disposition existante. Laissez ce champ vide, car la page de disposition est déjà configurée dans le fichier _ViewStart.cshtml.

  • Sélectionnez tous les fichiers à remplacer. Ces options vous donnent un contrôle précis de la façon dont les comptes sont gérés dans votre application. Pour plus de simplicité, cochez la case Remplacer tous les fichiers

Dans la liste déroulante de contexte des données, cliquez sur le signe plus. Il se trouve à droite. Voici ce que vous devriez voir :

Fenêtre Ajouter un contexte de données
Fenêtre Ajouter un contexte de données
  • Cliquez sur le bouton Ajouter. Vous disposez désormais d'une nouvelle classe de contexte de données qui représente une version objet de la base de données de votre application.

  • Cliquez maintenant sur le signe plus (+) à droite de la liste déroulante Classe utilisateur :

Fenêtre Ajouter une classe utilisateur
Fenêtre Ajouter une classe utilisateur
  • Cliquez sur Ajouter. Vous disposez maintenant d'une nouvelle classe utilisateur nommée MonAppliSecuriseeUser. Elle représente l'ensemble des comptes d'utilisateurs de votre application. Nous reviendrons sur ces deux classes un peu plus tard dans ce chapitre. Pour le moment, terminons le processus de génération automatique de modèles et penchons-nous sur quelques-uns des fichiers générés.

  • Cliquez à nouveau sur Ajouter (en bas de la fenêtre Ajouter Identité).

Le processus de génération automatique de modèles peut prendre une à deux minutes. Une fois l'opération terminée, vous pouvez consulter le code ajouté dans l'explorateur de solutions. Sélectionnez Areas > Identity > Pages > Account.

Consultez le code ajouté dans l'explorateur de solutions
Consultez le code ajouté dans l'explorateur de solutions

Examinons maintenant les trois extraits de code correspondant respectivement à l'inscription, la connexion et la déconnexion.

Inscription, connexion et déconnexion

Localisez le fichier Register.cshtml dans le dossier Account et double-cliquez dessus. Il s'agit de la vue qui est utilisée pour effectuer le rendu de la page d'inscription des utilisateurs. Vous verrez une petite flèche dans l'explorateur de solutions, à côté du fichier Register.cshtml. Cliquez dessus pour développer le fichier. 

Vous voyez maintenant Register.cshtml.cs sous forme d'option sous la page Register.cshtml. Ce fichier contient la classe  RegisterModel , qui elle-même contient le modèle de données et les actions de contrôleur qui gèrent la page Register. Double-cliquez sur Register.cshtml.cs pour ouvrir ce fichier.

Ses lignes 16 à 63 configurent le modèle de données de la page d'inscription. À partir de la ligne 65 commence la méthode  OnPostAsync . Cette méthode gère la création d'un compte utilisateur à partir des données fournies par l'utilisateur et stockées dans les attributs de données de la classe  RegisterModel . C'est également ici que vous pouvez personnaliser le processus de création de comptes. Nous n'allons pas y toucher pour le moment, mais souvenez-vous-en. Vous aurez besoin d'y revenir pour un projet plus loin dans ce cours. 

Prenez quelques minutes pour répéter l'opération avec Login.cshtml et Logout.cshtml. Familiarisez-vous avec le code des vues et avec les modèles de données de chacune de ces trois pages. Plus tard dans ce cours, vous allez devoir modifier l'apparence des pages, et personnaliser les processus d'inscription et de connexion. Il est donc important que vous ayez au moins une idée du code existant.

En résumé 

Dans ce chapitre :

  • Vous avez créé dans Visual Studio un projet .NET MVC comportant des comptes individuels.

  • Vous avez personnalisé les paramètres utilisateur et de configuration Identity, notamment les critères des mots de passe et les paramètres de verrouillage.

  • Vous avez activé ASP.NET Identity.

  • Vous avez ajouté ASP.NET Identity à un projet existant par génération automatique de modèles, et inclus les fonctions et pages d'inscription, de connexion et de déconnexion.

Dans le chapitre suivant, nous allons voir comment authentifier les utilisateurs avec Entity Framework. Vous avez commencé ce processus dans la classe MVC, mais vous allez mieux comprendre à quel point ce processus pourtant complexe peut être simplifié.

Exemple de certificat de réussite
Exemple de certificat de réussite