S’authentifier auprès des ressources Azure à partir d’applications JavaScript locales

Les applications s’exécutant en dehors d’Azure (par exemple en local ou dans un centre de données tiers) doivent utiliser un principal de service d’application pour s’authentifier auprès d’Azure lors de l’accès aux ressources Azure. Les objets principaux du service d’application sont créés à l’aide du processus d’inscription d’application dans Azure. Lorsqu’un principal de service d’application est créé, un ID client et une clé secrète client sont générés pour votre application. Vous stockez l’ID client, la clé secrète client et votre ID de locataire dans les variables d’environnement afin que le Kit de développement logiciel (SDK) Azure pour JavaScript utilise les variables d’environnement pour authentifier votre application auprès d’Azure au moment de l’exécution.

Une inscription d’application différente doit être créée pour chaque environnement (par exemple, test, phase, production) dans laquelle l’application s’exécute. Cela permet de configurer des autorisations de ressources spécifiques à l’environnement pour chaque principal de service et de s’assurer qu’une application déployée dans un environnement ne communique pas avec les ressources Azure qui font partie d’un autre environnement.

1. Enregistrement de l'application dans Azure AD

Une application peut être inscrite auprès d’Azure à l’aide du Portail Azure ou d’Azure CLI.

Connectez-vous au portail Azure et suivez les étapes ci-dessous.

Instructions Capture d'écran
Dans le portail Azure :
  1. Entrez inscriptions d’applications dans la barre de recherche en haut du Portail Azure.
  2. Sélectionnez l’élément étiqueté Inscriptions d’applications sous le titre Services dans le menu qui apparaît sous la barre de recherche.
A screenshot showing how to use the top search bar in the Azure portal to find and navigate to the App registrations page.
Dans la page Inscriptions d’applications, sélectionnez + Nouvelle inscription. A screenshot showing the location of the New registration button in the App registrations page.
Dans la page Inscription d’une application, remplissez le formulaire comme suit :
  1. Nom → Entrez un nom pour l’inscription de l’application dans Azure. Il est recommandé d’inclure le nom de l’application et l’environnement (test, prod) pour lequel l’inscription de l’application est destinée.
  2. Types de comptes pris en chargeComptes dans cet annuaire organisationnel uniquement.
Sélectionnez Inscrire pour inscrire votre application et créer le principal du service d’application.
A screenshot to fill out Register by giving the app a name and specifying supported account types as accounts in this organizational directory only.
Dans la page Inscription de l’application pour votre application :
  1. ID d’application (client) → Il s’agit de l’ID d’application que votre application utilisera pour accéder à Azure pendant le développement local. Copiez cette valeur dans un emplacement temporaire dans un éditeur de texte, car vous en aurez besoin dans une prochaine étape.
  2. ID d’annuaire (locataire) → Cette valeur sera également nécessaire par votre application lorsqu’elle s’authentifie auprès d’Azure. Copiez cette valeur dans un emplacement temporaire dans un éditeur de texte, car elle sera nécessaire à une étape ultérieure.
  3. Informations d’identification client → Vous devez définir les informations d’identification du client pour l’application avant que votre application puisse s’authentifier auprès d’Azure et utiliser les services Azure. Sélectionnez Ajouter un certificat ou un secret pour ajouter des informations d’identification pour votre application.
A screenshot of the App registration after completion. This screenshot shows the application and tenant IDs, which will be needed in a future step.
Dans la page Certificats et secrets, sélectionnez + Nouvelle clé secrète client. A screenshot showing the location of the link to use to create a new client secret on the certificates and secrets page.
La boîte de dialogue Ajouter une clé secrète client s’affiche à droite de la page. Dans cette boîte de dialogue :
  1. Description → Entrez la valeur Current.
  2. Expire → Sélectionnez une valeur de 24 mois.
Sélectionnez Ajouter pour ajouter le secret.

IMPORTANT : Définissez un rappel dans votre calendrier avant la date d’expiration du secret. De cette façon, vous pouvez ajouter un nouveau secret avant et mettre à jour vos applications avant l’expiration de ce secret et éviter une interruption de service dans votre application.
A screenshot showing the page where a new client secret is added for the application service principal created by the app registration process.
La page Certificats et secrets affiche la valeur de la clé secrète client.

Copiez cette valeur dans un emplacement temporaire dans un éditeur de texte, car vous en avez besoin dans une prochaine étape.

IMPORTANT : Il s’agit de la seule fois où vous verrez cette valeur. Une fois que vous quittez ou actualisez cette page, vous ne pourrez plus voir cette valeur. Vous pouvez ajouter un autre secret client sans invalider ce secret client, mais vous ne verrez pas cette valeur à nouveau.
A screenshot showing the page with the generated client secret.

2 - Attribuer des rôles au principal du service d’application

Ensuite, vous devez déterminer les rôles (autorisations) dont votre application a besoin sur les ressources et affecter ces rôles à votre application. 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 pour le principal de service dans 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.
A screenshot showing the top search box in the Azure portal to locate and navigate to the resource group you want to assign roles (permissions) to.
Dans la page du groupe de ressources, sélectionnez Contrôle d’accès (IAM) dans le menu de gauche. A screenshot of the resource group page showing the location of the Access control (IAM) menu item.
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.
A screenshot showing how to navigate to the role assignments tab and the location of the button used to add role assignments to a resource group.
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.
A screenshot showing how to filter and select role assignments to be added to the resource group.
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.
A screenshot showing the radio button to select to assign a role to a Microsoft Entra group and the link used to select the group to assign the role to.
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 principal de service que vous avez créé pour que l’application filtre la liste.
  2. Sélectionnez le principal de service associé à votre application.
Sélectionnez Sélectionner en bas de la boîte de dialogue pour continuer.
A screenshot showing how to filter for and select the Microsoft Entra group for the application in the Select members dialog box.
Le principal de service 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.
A screenshot showing the completed Add role assignment page and the location of the Review + assign button used to complete the process.

3 - Configurer des variables d’environnement pour l’application

Vous devez définir les variables d’environnement AZURE_TENANT_IDet AZURE_CLIENT_SECRET les AZURE_CLIENT_IDvariables d’environnement pour le processus qui exécute votre application JavaScript pour rendre les informations d’identification du principal du service d’application disponibles pour votre application au moment de l’exécution. L’objet DefaultAzureCredential recherche les informations du principal de service dans ces variables d’environnement.

AZURE_CLIENT_ID=<value>
AZURE_TENANT_ID=<value>
AZURE_CLIENT_SECRET=<value>

4 - Implémenter DefaultAzureCredential dans l’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 package @azure/identity .

Tout d’abord, ajoutez 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.

// connect-with-default-azure-credential.js
import { BlobServiceClient } from '@azure/storage-blob';
import { DefaultAzureCredential } from '@azure/identity';
import 'dotenv/config'

const accountName = process.env.AZURE_STORAGE_ACCOUNT_NAME;
if (!accountName) throw Error('Azure Storage accountName not found');

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

Lorsque le code ci-dessus instancie l’objetDefaultAzureCredential, DefaultAzureCredential lit les variables AZURE_SUBSCRIPTION_IDd’environnement, AZURE_TENANT_IDAZURE_CLIENT_IDet AZURE_CLIENT_SECRET pour que les informations du principal du service d’application se connectent à Azure.