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.

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 aux seuls besoins de 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 suffit de l'ajouter au groupe Microsoft Entra pour l'application.
• Si un nouveau développeur rejoint l'équipe, il suffit de l'ajouter au bon groupe Microsoft Entra pour qu'il obtienne les permissions nécessaires 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, suivez les étapes suivantes pour créer un groupe Microsoft Entra.

Azure portal

Instructions	Capture d'écran
Naviguez jusqu'à 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 la rubrique services.
Dans la page Microsoft Entra ID, sélectionnez Groupes dans le menu de gauche.
Dans la page Tous les groupes, sélectionnez Nouveau groupe.
Dans la page Nouveau groupe : Type de groupe → Sécurité. 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 telle que local-dev dans le nom du groupe pour indiquer l’objectif du groupe. Description du groupe → Description de l’objectif du groupe. Sélectionnez le lien Aucun membre sélectionné sous Membres pour ajouter des membres au groupe.
Dans la boîte de dialogue Ajouter des membres : Utilisez la zone de recherche pour filtrer la liste des noms d’utilisateurs dans la liste. Choisissez un ou plusieurs utilisateurs pour le développement local de cette application. Lorsque vous choisissez un objet, l’objet passe à la liste des éléments sélectionnés en bas de la boîte de dialogue. Lorsque vous avez terminé, choisissez le bouton Sélectionner.
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.

Azure CLI

La commande az ad group create permet de créer des groupes dans Microsoft Entra ID. Les paramètres --display-name et --main-nickname sont obligatoires. Le nom donné au groupe doit être basé sur le nom de l’application. Il est également utile d’inclure une expression telle que « développement local » dans le nom du groupe pour indiquer l’objectif du groupe.

az ad group create \
    --display-name MyDisplay \
    --mail-nickname MyDisplay  \
    --description <group-description>

Pour ajouter des membres au groupe, vous aurez besoin de l’ID objet de l’utilisateur Azure. Utilisez la liste az ad user pour répertorier les principaux de service disponibles. La --filter commande de paramètre accepte les filtres de style OData et peut être utilisée pour filtrer la liste sur le nom d’affichage de l’utilisateur, comme indiqué. Le --query paramètre retourne les colonnes spécifiées.

az ad user list \
    --filter "startswith(displayName, 'Bob')" \
    --query "[].{objectId:objectId, displayName:displayName}" \
    --output table

La commande az ad group member add peut ensuite être utilisée pour ajouter des membres à des groupes.

az ad group member add \
    --group <group-name> \
    --member-id <object-id>

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 au niveau du groupe de ressources, car la plupart des applications regroupent toutes leurs ressources Azure dans un seul groupe de ressources.

Azure portal

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.
Dans la page du groupe de ressources, sélectionnez Contrôle d’accès (IAM) dans le menu de gauche.
Dans la page Contrôle d’accès (IAM) : Sélectionnez l’onglet Attributions de rôles. Sélectionnez + Ajouter dans le menu supérieur, puis Ajouter une attribution de rôle dans le menu déroulant résultant.
La page Ajouter une attribution de rôle répertorie tous les rôles qui peuvent être attribués pour le groupe de ressources. 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. Sélectionnez le rôle que vous voulez attribuer. Sélectionnez Suivant pour accéder à l’écran suivant.
La page de rôle suivante Ajouter une attribution vous permet de spécifier l’utilisateur auquel attribuer le rôle. Sélectionnez Utilisateur, groupe ou principal de service sous Attribuer l’accès à. Sélectionnez + Sélectionner des membres sous Membres Une boîte de dialogue s’ouvre sur le côté droit du Portail Azure.
Dans la boîte de dialogue Sélectionner des membres : 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. 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.
Le groupe Microsoft Entra apparaît désormais 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.

Azure CLI

Un principal de service d’application est affecté à un rôle dans Azure à l’aide de la commande az role assignment create.

az role assignment create --assignee "{appId}" \
    --scope /subscriptions/"{subscriptionName}" \
    --role "{roleName}" \
    --resource-group "{resourceGroupName}"

Pour obtenir les noms de rôles auxquels un principal de service peut être affecté, utilisez la commande az role definition list.

az role definition list --query "sort_by([].{roleName:roleName, description:description}, &roleName)" --output table

Par exemple, pour permettre au principal du service d’application de lire, d’écrire et de supprimer l’accès à Stockage Azure conteneurs d’objets blob et aux données à tous les comptes de stockage du groupe de ressources msdocs-sdk-auth-example, vous affectez le principal du service d’application au rôle Contributeur aux données blob de stockage à l’aide de la commande suivante.

az role assignment create --assignee "aaaaaaaa-bbbb-cccc-7777-888888888888" \
    --scope /subscriptions/"Storage Blob Data Subscriber" \
    --role "Storage Blob Data Contributor" \
    --resource-group "msdocs-sdk-auth-example"

Pour plus d’informations sur l’attribution d’autorisations au niveau de la ressource ou de l’abonnement à l’aide d’Azure CLI, consultez l’article Attribuer des rôles Azure à l’aide d’Azure CLI.

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

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 SDK Azure auprès d'Azure, votre application doit utiliser la classe DefaultAzureCredential du package @azure/identity. Dans ce scénario, DefaultAzureCredential vérifiez de manière séquentielle 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 devrez :

1. Importez la classe DefaultAzureCredential du module @azure/identity.
2. Créez un objet DefaultAzureCredential.
3. Transmettez l'objet DefaultAzureCredential au constructeur de l'objet client du 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.