Labo 06 : S’authentifier à l’aide de kits de développement logiciel (SDK) OpenID Connect, MSAL et .NET

Interface utilisateur Microsoft Azure

Étant donné la nature dynamique des outils cloud Microsoft, il se peut que vous constatiez des modifications de l’interface utilisateur Azure après le développement du contenu de cette formation. Il se peut donc que certaines instructions et étapes du labo ne s’alignent pas correctement.

Microsoft met ce cours à jour quand la communauté l’alerte sur la nécessité d’y apporter des modifications. Toutefois, compte tenu de la fréquence des mises à jour cloud, il se peut que vous rencontriez des modifications de l’interface utilisateur avant les mises à jour du contenu de cette formation. Si cela se produit, adaptez-vous aux changements, puis appliquez-les dans les laboratoires si nécessaire.

Instructions

Avant de commencer

Se connecter à l’environnement de labo

Connectez-vous à votre machine virtuelle (VM) Windows 11 en utilisant les informations d’identification suivantes :

Nom d’utilisateur : Admin
Mot de passe : Pa55w.rd

Remarque : Votre instructeur vous fournira des instructions pour la connexion à l’environnement de laboratoire virtuel.

Passer en revue les applications installées

Recherchez la barre des tâches sur votre bureau Windows 11. La barre des tâches contient les icônes des applications que vous allez utiliser dans ce labo, à savoir :

Microsoft Edge
Visual Studio Code

Scénario de laboratoire

Dans ce labo, vous allez inscrire une application dans Microsoft Entra ID, ajouter un utilisateur, puis tester l’accès de l’utilisateur à l’application pour vérifier qu’Entra ID peut le sécuriser.

Diagramme de l’architecture

Diagramme d’architecture montrant un utilisateur en train de s’authentifier à l’aide de kits de développement logiciel (SDK) OpenID Connect, MSAL et .NET.

Exercice 1 : configurer un environnement Entra ID monolocataire

Tâche 1 : Ouvrir le portail Azure

Dans la barre des tâches, sélectionnez l’icône Microsoft Edge.
Dans la fenêtre de navigateur ouverte, accédez au portail Azure à l’adresse https://portal.azure.com, puis connectez-vous avec le compte que vous allez utiliser pour ce labo.

Remarque : Si vous vous connectez au portail Azure la première fois, une visite guidée du portail vous sera proposée. Sélectionnez Prise en main pour faire l’impasse sur la visite guidée et commencer à utiliser le portail.

Tâche 2 : inscrire une application dans l’annuaire Entra ID

Sur le portail Azure, utilisez la zone de texte Rechercher des ressources, des services et des documents pour rechercher Entra ID, puis, dans la liste des résultats, sélectionnez Microsoft Entra ID.

Remarque : cela a pour effet de rediriger votre session de navigateur vers le volet du locataire Microsoft Entra ID associé à votre abonnement Azure.
Dans le volet Microsoft Entra ID , dans la section Gérer, sélectionnez Inscriptions d’applications.
Dans la section Inscriptions d’applications, sélectionnez + Nouvelle inscription.

Dans la section Inscrire une application, effectuez les actions suivantes, puis sélectionnez Inscrire:

Paramètre	Action
Zone de texte Nom	Entrez webappoidc.
Liste Types de comptes pris en charge	Select Comptes dans cet annuaire organisationnel uniquement (Annuaire par défaut uniquement – Locataire unique)

Remarque : Le nom du locataire peut différer en fonction de votre abonnement Azure.

La capture d’écran suivante affiche les paramètres configurés dans la section Inscrire une application.

Capture d’écran montrant les options configurées pour inscrire une application.

Tâche 3: Enregistrer des identificateurs uniques

Dans le panneau d’inscription d’application webappoidc, sélectionnez Vue d’ensemble.
Dans la section Vue d’ensemble, recherchez et enregistrez la valeur de la zone de texte ID d’application (client). Vous allez utiliser cette valeur plus tard dans ce labo.
Dans la section Vue d’ensemble, recherchez et enregistrez la valeur de la zone de texte ID d’annuaire (client). Vous allez utiliser cette valeur plus tard dans ce labo.

Tâche 4: Configurer les paramètres d’authentification d’application

Dans le volet d’inscription d’application webappoidc, dans la section Gérer, sélectionnez Authentification.

Dans la section Authentification, effectuez les actions suivantes, puis sélectionnez Configurer:

Paramètre	Action
Section Configurations de plateforme	Sélectionnez Ajouter une plateforme.
Volet Configurer des plateformes	Sélectionnez Web.
Zone de texte URI de redirection	Entrez `https://localhost:5001/`
Zone de texte URL de déconnexion de canal frontal	Entrez `https://localhost:5001/signout-oidc`

De retour dans la section Configurations de la plateforme, sélectionnez Ajouter un URI, puis entrez https://localhost:5001/signin-oidc.
Dans la section Flux d’octroi implicites et hybrides, sélectionnez Jetons d’ID (utilisés pour les flux implicites et hybrides).
Sélectionnez Enregistrer.

La capture d’écran suivante affiche les paramètres configurés dans le volet Authentification.

Tâche 5 : créer un utilisateur Microsoft Entra ID

Dans le portail Azure, sélectionnez l’icône Cloud Shell pour ouvrir Cloud Shell. Si Cloud Shell utilise par défaut une session Bash, sélectionnez Basculer vers PowerShell dans le menu Cloud Shell , puis Confirmer.

Remarque : l’icône Cloud Shell est représentée par un signe supérieur à (>) et un caractère de soulignement (_).

Si vous démarrez Cloud Shell pour la première fois, une invite Prise en main s’affiche. Sélectionnez Aucun compte de stockage requis, puis sélectionnez Appliquer.
Dans le volet Cloud Shell, exécutez la commande suivante pour vous connecter au locataire Microsoft Entra associé à votre abonnement Azure :
```
 Connect-AzureAD
```
Exécutez la commande suivante pour récupérer et afficher le nom de domaine DNS (Domain Name System) principal du locataire Microsoft Entra :
```
 $aadDomainName = ((Get-AzureAdTenantDetail).VerifiedDomains)[0].Name
 $aadDomainName
```
Remarque : enregistrez la valeur du nom de domaine DNS. Vous allez utiliser cette valeur plus tard dans ce labo.

Exécutez les commandes suivantes pour créer les utilisateurs Microsoft Entra ID que vous allez utiliser pour tester l’authentification Microsoft Entra ID :

 $passwordProfile = New-Object -TypeName Microsoft.Open.AzureAD.Model.PasswordProfile
 $passwordProfile.Password = 'Pa55w.rd1234'
 $passwordProfile.ForceChangePasswordNextLogin = $false
 New-AzureADUser -AccountEnabled $true -DisplayName 'aad_lab_user1' -PasswordProfile $passwordProfile -MailNickName 'aad_lab_user1' -UserPrincipalName "aad_lab_user1@$aadDomainName"

Exécutez la commande suivante pour identifier le nom d’utilisateur principal (UPN) de l’utilisateur Microsoft Entra ID récemment créé :
```
 (Get-AzureADUser -Filter "MailNickName eq 'aad_lab_user1'").UserPrincipalName
```
Remarque : enregistrez l’UPN. Vous allez utiliser cette valeur plus tard dans ce labo.
Fermez le volet Cloud Shell.

Révision

Dans cet exercice, vous avez inscrit une application Azure AD monolocataire et créé un compte d’utilisateur Azure AD.

Exercice 2 : Créer une application web ASP.NET monolocataire

Tâche 1 : Créer un projet d’application web ASP.NET

Sur l’ordinateur lab, démarrez l’invite de commandes.
À partir de l’invite de commandes, exécutez les commandes suivantes pour créer et définir le répertoire actuel sur Allfiles (F):\Allfiles\Labs\06\Starter\OIDCClient :
```
 F:
 cd F:\Allfiles\Labs\06\Starter\OIDCClient
```
Exécutez les commandes suivantes pour créer une application web .NET Core basée sur le modèle MVC (Model View Controller) (remplacez les espaces réservés, <application_ID>, <tenant_ID> et <domain_Name> par les valeurs correspondantes que vous avez enregistrées précédemment dans ce labo) :
```
 dotnet new mvc --auth SingleOrg --client-id <application_ID> --tenant-id <tenant_ID> --domain <domain_Name>
 rmdir .\obj /S /Q
```
Remarque : si une erreur s’affiche dans le terminal, il est possible que vous utilisiez PowerShell. Dans ce cas, supprimez les indicateurs /S /Q et réexécutez la commande.
Exécutez la commande suivante pour démarrer Visual Studio Code.
```
 code .
```
Si vous avez la question Faites-vous confiance aux auteurs de tous les fichiers de ce dossier ? , sélectionnez Oui, je fais confiance aux auteurs.
Dans le volet Explorateur de Visual Studio Code, examinez la structure de dossiers générée automatiquement qui représente une application web MVC.

Accédez au dossier Propriétés, ouvrez le fichier launchSettings.json, puis appliquez les modifications suivantes:

Section	Propriété	Valeur
iisSettings	sslPort	44321
https	applicationUrl	`https://localhost:5001`

Remarque : les numéros de port doivent correspondre à la valeur que vous avez spécifiée lors de la création de l’inscription d’application Microsoft Entra ID.

Enregistrez le fichier et fermez-le.
Dans le volet Visual Studio Explorateur de Visual Studio Code, sélectionnez OIDCClient.csproj.
Vérifiez que la valeur de l’élément <TargetFramework> est définie sur net8.0.
Vérifiez que la version des packages NuGet Microsoft.AspNetCore.Authentication.JwtBearer et Microsoft.AspNetCore.Authentication.OpenIdConnect est définie sur 8.0.0.

Vérifiez que le contenu du fichier OIDCClient.csproj ressemble à la liste suivante (la valeur de UserSecretsId sera différente) et enregistrez les modifications.

 <Project Sdk="Microsoft.NET.Sdk.Web">

   <PropertyGroup>
     <TargetFramework>net8.0</TargetFramework>
     <Nullable>enable</Nullable>
     <ImplicitUsings>enable</ImplicitUsings>
     <UserSecretsId>aspnet-OIDCClient-5249f5b2-6266-4a13-b8b4-e79c6443aabc</UserSecretsId>
   </PropertyGroup>

   <ItemGroup>
     <PackageReference Include="Microsoft.AspNetCore.Authentication.JwtBearer" Version="8.0.0-rc.2.23480.2" NoWarn="NU1605" />
     <PackageReference Include="Microsoft.AspNetCore.Authentication.OpenIdConnect" Version="8.0.0-rc.2.23480.2" NoWarn="NU1605" />
     <PackageReference Include="Microsoft.Identity.Web" Version="2.13.0" />
     <PackageReference Include="Microsoft.Identity.Web.UI" Version="2.13.0" />
     <PackageReference Include="Microsoft.Identity.Web.DownstreamApi" Version="2.13.0" />
   </ItemGroup>

 </Project>

Fermez le fichier OIDCClient.csproj.
Accédez au dossier Views\Shared, puis ouvrez le fichier _LoginPartial.cshtml.

Vérifiez que l’attribut asp-area de chaque élément span référence MicrosoftIdentity, comme dans la ligne suivante :

 <a class="nav-link text-dark" asp-area="MicrosoftIdentity" asp-controller="Account" asp-action="SignOut">Sign out</a>

Fermez le fichier sans apporter de modifications.

Ouvrez le fichier appsettings.json dans le dossier racine et passez en revue le contenu de l’objet AzureAd, y compris les éléments suivants :

Élément	Valeur
`Instance`	`https://login.microsoftonline.com/`
`Domain`	Domaine DNS principal du locataire Azure AD associé à votre abonnement Azure
`TenantId`	GUID du locataire Azure AD
`ClientId`	ID d’application (client) de l’application inscrite dans le locataire Azure AD
`CallbackPath`	`/signin-oidc`

Fermez le fichier sans apporter de modifications.
Dans le volet Explorateur de Visual Studio Code, sélectionnez Program.cs.

Vérifiez que le fichier contient les directives using suivantes :

 using Microsoft.AspNetCore.Authentication.OpenIdConnect;
 using Microsoft.Identity.Web;
 using Microsoft.Identity.Web.UI;

Vérifiez que le fichier contient les lignes suivantes qui ajoutent les services d’authentification appropriés au conteneur :

 // Add services to the container.
 builder.Services.AddAuthentication(OpenIdConnectDefaults.AuthenticationScheme)
   .AddMicrosoftIdentityWebApp(builder.Configuration.GetSection("AzureAd"));

Vérifiez que le fichier contient les lignes suivantes qui ajoutent un contrôleur et des pages Razor pour la gestion des comptes :
```
 builder.Services.AddRazorPages()
   .AddMicrosoftIdentityUI();
```
Enregistrez et fermez le fichier.

Tâche 2 : Tester l’application web monolocataire dans un scénario monolocataire

Dans la fenêtre Visual Studio Code, dans sa barre de menus supérieure, accédez au menu Terminal et sélectionnez Nouveau terminal.
Dans le panneau Terminal, le chemin actuel du répertoire de travail actuel doit être F:\Allfiles\Labs\06\Starter\OIDCClient. Exécutez les commandes suivantes pour générer l’application web .NET :
```
 dotnet build
```
Remarque : s’il existe des erreurs de build, passez en revue les fichiers dans le dossier Allfiles (F):\Allfiles\Labs\06\Solution\OIDCClient. Ignorez les éventuels messages d’avertissement.
Exécutez la commande suivante pour générer un certificat auto-signé et configurer l’ordinateur local pour l’approuver:
```
 dotnet dev-certs https --trust
```
Si vous êtes invité à installer le certificat généré automatiquement, sélectionnez Oui.
À partir de l’invite de Terminal, exécutez la commande suivante pour exécuter l’application web .NET :
```
 dotnet run
```
Démarrez le navigateur Microsoft Edge en mode InPrivate, puis accédez à l’URL https://localhost:5001.
Si vous voyez s’afficher le message Votre connexion n’est pas privée, sélectionnez Avancé, puis le lien Continuer sur localhost (non sécurisé).
Dans la fenêtre de navigateur ouverte, quand vous y êtes invité, authentifiez-vous à l’aide de l’UPN du compte Microsoft Entra ID aad_lab_user1 créé précédemment dans ce labo avec le mot de passe Pa55w.rd1234.

Remarque : si vous voyez s’afficher une fenêtre Aidez-nous à protéger votre compte, sélectionnez Ignorer pour le moment.

Remarque : si vous recevez le message Approbation de l’administrateur requise, vous devez utiliser à la place un compte Microsoft Entra ID avec des privilèges élevés pour effectuer le reste de cette tâche. Pour ce faire, sélectionnez le lien Vous avez un compte administrateur ? Connectez-vous avec ce compte, connectez-vous avec un compte administrateur et passez à l’étape suivante.
La fenêtre du navigateur ouvrira automatiquement la page web Autorisations demandées.
Examinez les autorisations requises, notamment Afficher votre profil de base et Conserver l’accès aux données auxquelles vous lui avez donné accès.
Sélectionnez Accepter.
Passez en revue la page d’accueil Bienvenue du site cible affichée dans le navigateur, et vérifiez que l’UPN du compte Microsoft Entra ID aad_user1 apparaît dans la fenêtre du navigateur.
Dans la page Bienvenue, sélectionnez Se déconnecter.
Quand vous êtes invité à sélectionner le compte à déconnecter, sélectionnez le compte Microsoft Entra ID aad_lab_user1. Vous serez automatiquement redirigé vers la page Déconnecté.
Fermez le navigateur Microsoft Edge.

Révision

Dans cet exercice, vous avez implémenté une application web monolocataire et vous l’avez testée dans un environnement Microsoft Entra monolocataire.