Authentifier des applications JavaScript auprès des services Azure pendant le développement local à l’aide de comptes de développeur

Lorsque vous créez des applications cloud, les développeurs doivent déboguer et tester des applications sur leur station de travail locale. Lorsqu’une application est exécutée sur la station de travail d’un développeur pendant le développement local, elle doit toujours s’authentifier auprès des services Azure utilisés par l’application. Cet article explique comment utiliser les informations d’identification Azure d’un développeur pour authentifier l’application auprès d’Azure pendant le développement local.

Diagramme montrant une application de développement locale en cours d’exécution pour obtenir un principal de service à partir d’un fichier .env et utiliser cette identité pour se connecter aux ressources Azure.

Pour qu’une application s’authentifie auprès d’Azure pendant le développement local à l’aide des informations d’identification Azure du développeur, le développeur doit être connecté à Azure à partir de l’extension Visual Studio Code Azure Tools, d’Azure CLI ou d’Azure PowerShell. Le Kit de développement logiciel (SDK) Azure pour JavaScript est en mesure de détecter que le développeur est connecté à partir de l’un de ces outils, puis d’obtenir les informations d’identification nécessaires à partir du cache d’informations d’identification pour authentifier l’application auprès d’Azure en tant qu’utilisateur connecté.

Cette approche est plus simple à configurer pour une équipe de développement, car elle tire parti des comptes Azure existants des développeurs. Toutefois, le compte d’un développeur aura probablement plus d’autorisations que nécessaire par l’application, ce qui dépasse les autorisations avec laquelle l’application s’exécute en production. En guise d’alternative, vous pouvez créer des principaux de service d’application à utiliser pendant le développement local, qui peuvent être limités pour avoir uniquement l’accès nécessaire par l’application.

1 - Créer un groupe Microsoft Entra pour le développement local

Étant donné qu’il existe presque toujours plusieurs développeurs qui travaillent sur une application, il est recommandé de créer d’abord un groupe Microsoft Entra pour encapsuler les rôles (autorisations) dont l’application a besoin dans le développement local. Cela offre les avantages suivants.

  • Chaque développeur est assuré d’avoir les mêmes rôles attribués, car les rôles sont attribués au niveau du groupe.
  • Si un nouveau rôle est nécessaire pour l’application, il doit uniquement être ajouté au groupe Microsoft Entra pour l’application.
  • Si un nouveau développeur rejoint l’équipe, il doit simplement être ajouté au groupe Microsoft Entra approprié pour obtenir les autorisations appropriées pour travailler sur l’application.

Si vous disposez d’un groupe Microsoft Entra existant pour votre équipe de développement, vous pouvez utiliser ce groupe. Sinon, effectuez les étapes suivantes pour créer un groupe Microsoft Entra.

Instructions Capture d'écran
Accédez à la page MICROSOFT Entra ID dans le Portail Azure en tapant Microsoft Entra ID dans la zone de recherche en haut de la page, puis en sélectionnant Microsoft Entra ID dans les services. Capture d’écran montrant comment utiliser la barre de recherche supérieure dans le Portail Azure pour rechercher et accéder à la page Microsoft Entra ID.
Dans la page MICROSOFT Entra ID , sélectionnez Groupes dans le menu de gauche. Capture d’écran montrant l’emplacement de l’élément de menu Groupes dans le menu de gauche de la page Répertoire par défaut microsoft Entra ID.
Dans la page Tous les groupes, sélectionnez Nouveau groupe. Capture d’écran montrant l’emplacement du bouton Nouveau groupe dans la page Tous les groupes.
Dans la page Nouveau groupe :
  1. Type de groupeSécurité.
  2. Nom du groupe → Nom du groupe de sécurité, généralement créé à partir du nom de l’application. Il est également utile d’inclure une chaîne comme le développement local dans le nom du groupe pour indiquer l’objectif du groupe.
  3. Description du groupe → Description de l’objectif du groupe.
  4. Sélectionnez le lien Aucun membre sélectionné sous Membres pour ajouter des membres au groupe.
Capture d’écran montrant comment créer un groupe Microsoft Entra. L’emplacement du lien à sélectionner pour ajouter des membres à ce groupe est mis en surbrillance.
Dans la boîte de dialogue Ajouter des membres :
  1. Utilisez la zone de recherche pour filtrer la liste des noms d’utilisateurs dans la liste.
  2. Choisissez un ou plusieurs utilisateurs pour le développement local pour cette application. Lorsque vous choisissez un objet, l’objet se déplace vers la liste des éléments sélectionnés en bas de la boîte de dialogue.
  3. Lorsque vous avez terminé, choisissez le bouton Sélectionner .
Capture d’écran de la boîte de dialogue Ajouter des membres montrant comment sélectionner des comptes de développeur à inclure dans le groupe.
Sur la page Nouveau groupe, sélectionnez Créer pour créer le groupe.

Le groupe sera créé et vous serez redirigé vers la page Tous les groupes. L’affichage du groupe peut prendre jusqu’à 30 secondes et vous devrez peut-être actualiser la page en raison de la mise en cache dans le Portail Azure.
Capture d’écran de la page Nouveau groupe montrant comment terminer le processus en sélectionnant le bouton Créer.

2 - Attribuer des rôles au groupe Microsoft Entra

Ensuite, vous devez déterminer les rôles (autorisations) dont votre application a besoin sur les ressources et affecter ces rôles à votre application. Dans cet exemple, les rôles sont attribués au groupe Microsoft Entra créé à l’étape 1. Les rôles peuvent se voir attribuer un rôle au niveau d’une ressource, d’un groupe de ressources ou d’une étendue d’abonnement. Cet exemple montre comment attribuer des rôles à l’étendue du groupe de ressources, car la plupart des applications regroupent toutes leurs ressources Azure dans un seul groupe de ressources.

Instructions Capture d'écran
Recherchez le groupe de ressources pour votre application en recherchant le nom du groupe de ressources à l’aide de la zone de recherche en haut du portail Azure.

Accédez à votre groupe de ressources en sélectionnant le nom du groupe de ressources sous le titre Groupes de ressources dans la boîte de dialogue.
Capture d’écran montrant comment utiliser la zone de recherche supérieure dans le portail Azure pour localiser et accéder au groupe de ressources auquel vous souhaitez attribuer des rôles (autorisations).
Dans la page du groupe de ressources, sélectionnez Contrôle d’accès (IAM) dans le menu de gauche. Capture d’écran de la page du groupe de ressources montrant l’emplacement de l’élément de menu Contrôle d’accès (IAM).
Dans la page Contrôle d’accès (IAM) :
  1. Sélectionnez l’onglet Attributions de rôles.
  2. Sélectionnez + Ajouter dans le menu supérieur, puis Ajouter une attribution de rôle dans le menu déroulant résultant.
Capture d’écran montrant comment accéder à l’onglet Attributions de rôles et à l’emplacement du bouton utilisé pour ajouter des attributions de rôles à un groupe de ressources.
La page Ajouter une attribution de rôle répertorie tous les rôles qui peuvent être attribués pour le groupe de ressources.
  1. Utilisez la zone de recherche pour filtrer la liste afin de la rendre plus facile à gérer. Cet exemple montre comment filtrer les rôles d’objets blob de stockage.
  2. Sélectionnez le rôle que vous voulez attribuer.
    Sélectionnez Suivant pour accéder à l’écran suivant.
Capture d’écran montrant comment filtrer et sélectionner des attributions de rôles à ajouter au groupe de ressources.
La page de rôle suivante Ajouter une attribution vous permet de spécifier l’utilisateur auquel attribuer le rôle.
  1. Sélectionnez Utilisateur, groupe ou principal de service sous Attribuer l’accès à.
  2. Sélectionnez + Sélectionner des membres sous Membres
Une boîte de dialogue s’ouvre sur le côté droit de la Portail Azure.
Capture d’écran montrant la case d’option permettant d’attribuer un rôle à un groupe Microsoft Entra et le lien utilisé pour sélectionner le groupe auquel attribuer le rôle.
Dans la boîte de dialogue Sélectionner des membres :
  1. La zone de texte Sélectionner peut être utilisée pour filtrer la liste des utilisateurs et des groupes de votre abonnement. Si nécessaire, tapez les premiers caractères du groupe Microsoft Entra de développement local que vous avez créé pour l’application.
  2. Sélectionnez le groupe Microsoft Entra de développement local associé à votre application.
Sélectionnez Sélectionner en bas de la boîte de dialogue pour continuer.
Capture d’écran montrant comment filtrer et sélectionner le groupe Microsoft Entra pour l’application dans la boîte de dialogue Sélectionner des membres.
Le groupe Microsoft Entra s’affiche comme sélectionné dans l’écran Ajouter une attribution de rôle.

Sélectionnez Vérifier + affecter pour accéder à la page finale, puis Vérifier + attribuer à nouveau pour terminer le processus.
Capture d’écran montrant la page Ajouter une attribution de rôle terminée et l’emplacement du bouton Vérifier + affecter utilisé pour terminer le processus.

3 - Se connecter à Azure à l’aide de VS Code, d’Azure CLI ou d’Azure PowerShell

Ouvrez un terminal sur votre station de travail de développeur et connectez-vous à Azure à partir d’Azure PowerShell.

Connect-AzAccount

4 - Implémenter DefaultAzureCredential dans votre application

Pour authentifier les objets clients du Kit de développement logiciel (SDK) Azure sur Azure, votre application doit utiliser la DefaultAzureCredential classe à partir du @azure/identity package. Dans ce scénario, DefaultAzureCredential case activée séquentiellement pour voir si le développeur s’est connecté à Azure à l’aide de l’extension d’outils Azure VS Code, d’Azure CLI ou d’Azure PowerShell. Si le développeur est connecté à Azure à l’aide de l’un de ces outils, les informations d’identification utilisées pour se connecter à l’outil seront utilisées par l’application pour s’authentifier auprès d’Azure.

Commencez par ajouter le package @azure/identity à votre application.

npm install @azure/identity

Ensuite, pour tout code JavaScript qui crée un objet client azure SDK dans votre application, vous devez :

  1. Importez la DefaultAzureCredential classe à partir du @azure/identity module.
  2. Créez un objet DefaultAzureCredential.
  3. Transmettez l’objet DefaultAzureCredential au constructeur d’objet client du Kit de développement logiciel (SDK) Azure.

Un exemple de cela est illustré dans le segment de code suivant.

import { BlobServiceClient } from '@azure/storage-blob';
import { DefaultAzureCredential } from '@azure/identity';

// Acquire a credential object
const tokenCredential = DefaultAzureCredential();

const blobServiceClient = BlobServiceClient(
        `https://${accountName}.blob.core.windows.net`,
        tokenCredential
);

DefaultAzureCredential détecte automatiquement le mécanisme d’authentification configuré pour l’application et obtient les jetons nécessaires pour authentifier l’application auprès d’Azure. Si une application utilise plusieurs clients sdk, le même objet d’informations d’identification peut être utilisé avec chaque objet client sdk.