Partager via


Démarrage rapide : connecter des utilisateurs et appeler l’API Microsoft Graph à partir d’une application web Node.js

Ce démarrage rapide utilise un exemple d’application web Node.js pour vous montrer comment connecter des utilisateurs à l’aide du flux de code d’autorisation et appelle l’API Microsoft Graph. L’exemple utilise MSAL Node pour gérer l’authentification.

Prérequis

Inscrire l’application et enregistrer les identificateurs

Pour terminer l’inscription, fournissez un nom à l’application et spécifiez les types de comptes pris en charge. Une fois l’inscription terminée, le volet Vue d’ensemble de l’application affiche les identificateurs nécessaires dans le code source de l’application.

  1. Connectez-vous au centre d’administration Microsoft Entra.

  2. Si vous avez accès à plusieurs tenants, utilisez l’icône Paramètres dans le menu supérieur pour basculer vers le tenant dans lequel vous voulez inscrire l’application à partir du menu Répertoires + abonnements.

  3. Accédez à Identité>Applications>Inscriptions d’applications, puis sélectionnez Nouvelle inscription.

  4. Entrez un Nom pour l’application, par exemple identity-client-web-app.

  5. Pour les Types de comptes pris en charge, sélectionnez Comptes dans cet annuaire organisationnel. Pour plus d’informations sur les différents types de comptes, sélectionnez l’option M’aider à choisir.

  6. Sélectionnez Inscrire.

    Capture d’écran illustrant la saisie d’un nom et la sélection d’un type de compte dans le centre d’administration Microsoft Entra.

  7. Le Vue d’ensemble de l’application s’affiche une fois l’inscription terminée. Enregistrez l’ID du répertoire (locataire) et l’ID d’application (client) à utiliser dans le code source de votre application.

    Capture d’écran illustrant les valeurs d’identificateurs sur la page Vue d’ensemble du centre d’administration Microsoft Entra.

    Remarque

    Il est possible de modifier les Types de comptes pris en charge. Pour cela, reportez-vous à Modifier les comptes pris en charge par une application.

Ajouter un URI de redirection de plateforme et créer une clé secrète client

Pour spécifier le type de votre application dans votre inscription d’application, suivez ces étapes :

  1. Sous Gérer, sélectionnez Authentification.
  2. Dans la page Configurations de plateforme, sélectionnez Ajouter une plateforme, puis sélectionnez l’option Web.
  3. Pour les URI de redirection, entrezhttp://localhost:3000/auth/redirect.
  4. Sous URL de déconnexion du canal frontal, entrez https://localhost:5001/signout-callback-oidc pour la déconnexion.
  5. Sélectionnez Configurer pour enregistrer vos modifications.
  6. Sous Gérer, sélectionnez Certificats et secrets>Clés secrètes client>Nouvelle clé secrète client. Choisissez une description, puis sélectionnez Ajouter.
  7. Notez la valeur du secret client pour une utilisation ultérieure. Cette valeur n’est affichée qu’une seule fois.

Cloner ou télécharger l’exemple d’application

Pour obtenir l’exemple d’application, vous pouvez le cloner à partir de GitHub ou le télécharger sous la forme d’un fichier .zip.

  • Pour cloner l’exemple, ouvrez une invite de commandes, accédez à l’emplacement où vous souhaitez créer le projet, puis entrez la commande suivante :

    git clone https://github.com/Azure-Samples/ms-identity-node.git
    
  • Téléchargez le fichier .zip. Extrayez-la dans un chemin d’accès de fichier où la longueur du nom est inférieure à 260 caractères.

Configurer le projet

Extrayez le projet, ouvrez le dossier ms-identity-node-main, puis ouvrez le fichier .env sous le dossier Application . Remplacez les valeurs ci-dessus par :

Variable Description Exemple(s)
Enter_the_Cloud_Instance_Id_Here Instance cloud Azure dans laquelle votre application est inscrite. https://login.microsoftonline.com/ (inclure la barre oblique de fin)
Enter_the_Tenant_Info_here ID de locataire ou domaine principal contoso.microsoft.com ou aaaabbbb-0000-cccc-1111-dddd2222eeee
Enter_the_Application_Id_Here ID client de l’application que vous avez inscrite 00001111-aaaa-2222-bbbb-3333cccc4444
Enter_the_Client_Secret_Here Secret client de l’application que vous avez inscrite A1b-C2d_E3f.H4i,J5k?L6m!N7o-P8q_R9s.T0u
Enter_the_Graph_Endpoint_Here Instance cloud Microsoft API Graph que votre application appellera https://graph.microsoft.com/ (inclure la barre oblique de fin)
Enter_the_Express_Session_Secret_Here Chaîne aléatoire de caractères utilisée pour signer le cookie de session Express A1b-C2d_E3f.H4...

Votre fichier doit ressembler à ce qui suit :

CLOUD_INSTANCE=https://login.microsoftonline.com/
TENANT_ID=aaaabbbb-0000-cccc-1111-dddd2222eeee
CLIENT_ID=00001111-aaaa-2222-bbbb-3333cccc4444
CLIENT_SECRET=A1b-C2d_E3f.H4...

REDIRECT_URI=http://localhost:3000/auth/redirect
POST_LOGOUT_REDIRECT_URI=http://localhost:3000

GRAPH_API_ENDPOINT=https://graph.microsoft.com/

EXPRESS_SESSION_SECRET=6DP6v09eLiW7f1E65B8k

Exécuter l’application et se connecter

Exécutez le projet avec Node.js.

  1. Pour démarrer le serveur, exécutez les commandes suivantes dans le répertoire du projet :

    cd App
    npm install
    npm start
    
  2. Accédez à http://localhost:3000/.

  3. Sélectionnez Se connecter pour démarrer le processus de connexion.

    La première fois que vous vous connectez, vous êtes invité à autoriser l’application à accéder à votre profil et à vous connecter. Une fois que vous êtes connecté, vous êtes redirigé vers la page d’accueil de l’application.

Informations complémentaires

Fonctionnement de l’exemple

L’exemple héberge un serveur web sur localhost, port 3000. Lorsqu’un navigateur web accède à cette adresse, l’application affiche la page d’accueil. Une fois que l’utilisateur sélectionne Se connecter, l’application redirige le navigateur vers l’écran de connexion Microsoft Entra, via l’URL générée par la bibliothèque de nœuds MSAL. Une fois que l’utilisateur donne son consentement, le navigateur redirige l’utilisateur vers la page d’accueil de l’application, avec un ID et un jeton d’accès.

MSAL Node

La bibliothèque MSAL Node connecte les utilisateurs et demande les jetons utilisés pour accéder à une API protégée par la plateforme d’identités Microsoft. Vous pouvez télécharger la dernière version à l’aide du gestionnaire de package (npm) Node.js :

npm install @azure/msal-node

Étape suivante

Approfondissez en créant une application web ASP.NET Core qui connecte les utilisateurs dans cette série de tutoriels en plusieurs parties :