Authentifier des applications JavaScript auprès des services Azure pendant le développement local à l’aide de principaux de service
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 configurer des objets de principal de service d’application dédiés à utiliser pendant le développement local.
Les principaux de service d’application dédiés pour le développement local vous permettent de suivre le principe des privilèges minimum pendant le développement de l’application. Étant donné que les autorisations sont limitées exactement à ce qui est nécessaire pour l’application pendant le développement, le code de l’application ne peut pas accéder accidentellement à une ressource Azure destinée à une autre application. Cette méthode empêche également les bogues de se produire lorsque l’application est déplacée en production, car l’application a été sur-privilégiée dans l’environnement de développement.
Un principal de service d’application est configuré pour l’application lorsque l’application est inscrite dans Azure. Lors de l’inscription d’applications pour le développement local, il est recommandé de :
- Créez des inscriptions d’application distinctes pour chaque développeur travaillant sur l’application. Cette méthode crée des principaux de service d’application distincts pour chaque développeur à utiliser pendant le développement local et évite la nécessité pour les développeurs de partager des informations d’identification pour un seul principal de service d’application.
- Créez des inscriptions d’applications distinctes par application. Cela limite les autorisations de l’application à ce qui est nécessaire à l’application.
Pendant le développement local, les variables d’environnement sont définies avec l’identité du principal du service d’application. Le Kit de développement logiciel (SDK) Azure pour JavaScript lit ces variables d’environnement et utilise ces informations pour authentifier l’application auprès des ressources Azure dont elle a besoin.
1. Enregistrement de l'application dans Azure AD
Les objets de principal du service d’application sont créés avec une inscription d’application dans Azure. Vous pouvez créer des principaux de service à l’aide des 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 :
|
|
| Dans la page Inscriptions d’applications, sélectionnez + Nouvelle inscription. | 
|
Dans la page Inscription d’une application, remplissez le formulaire comme suit :
|
|
Dans la page Inscription de l’application pour votre application :
|
|
| Dans la page Certificats et secrets, sélectionnez + Nouvelle clé secrète client. | 
|
La boîte de dialogue Ajouter une clé secrète client s’affiche à droite de la page. Dans cette boîte de dialogue :
|
|
| Dans la page Certificats et secrets , vous verrez la valeur de la clé secrète client. Copiez cette valeur dans un emplacement temporaire dans un éditeur de texte, car vous en aurez 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 d’autres secrets client sans invalider ce secret client, mais vous ne verrez pas cette valeur à nouveau. |
|
2 - Créer un groupe de sécurité Microsoft Entra pour le développement local
Étant donné qu’il existe généralement plusieurs développeurs qui travaillent sur une application, il est recommandé de créer un groupe Microsoft Entra pour encapsuler les rôles (autorisations) dont l’application a besoin dans le développement local plutôt que d’attribuer les rôles à des objets de principal de service individuels. 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, un nouveau principal de service d’application est créé pour le développeur et ajouté au groupe, ce qui garantit que le développeur dispose des autorisations appropriées pour travailler sur l’application.
| 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. | 
|
| 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 :
|
|
Dans la boîte de dialogue Ajouter des membres :
|
|
| 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. |
|
3 - Attribuer des rôles à l’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. Dans cet exemple, les rôles sont affectés au groupe Microsoft Entra créé à l’étape 2. 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. |
|
| 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) :
|
|
La page Ajouter une attribution de rôle répertorie tous les rôles qui peuvent être attribués pour le groupe de ressources.
|
|
La page de rôle suivante Ajouter une attribution vous permet de spécifier l’utilisateur auquel attribuer le rôle.
|
|
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. |
|
4 - Définir des variables d’environnement de développement local
L’objet DefaultAzureCredential recherche les informations du principal de service dans un ensemble de variables d’environnement au moment de l’exécution. Étant donné que la plupart des développeurs travaillent sur plusieurs applications, il est recommandé d’utiliser un package comme dotenv pour accéder à l’environnement à partir d’un .env fichier stocké dans le répertoire de l’application pendant le développement. Cela limite les variables d’environnement utilisées pour authentifier l’application auprès d’Azure afin qu’elles ne puissent être utilisées que par cette application.
Le .env fichier n’est jamais case activée dans le contrôle de code source, car il contient la clé secrète d’application pour Azure. Le fichier .gitignore standard pour JavaScript exclut automatiquement le .env fichier de case activée-in.
Pour utiliser le package, installez d’abord dotenv le package dans votre application.
npm install dotenv
Ensuite, créez un .env fichier dans le répertoire racine de votre application. Définissez les valeurs de variable d’environnement avec les valeurs obtenues à partir du processus d’inscription d’application comme suit :
AZURE_CLIENT_ID→ Valeur de l’ID d’application.AZURE_TENANT_ID→ Valeur de l’ID de locataire.AZURE_CLIENT_SECRET→ Mot de passe/informations d’identification générés pour l’application.
AZURE_CLIENT_ID=00000000-0000-0000-0000-000000000000
AZURE_TENANT_ID=11111111-1111-1111-1111-111111111111
AZURE_CLIENT_SECRET=abcdefghijklmnopqrstuvwxyz
Enfin, dans le code de démarrage de votre application, utilisez la dotenv bibliothèque pour lire les variables d’environnement à partir du .env fichier au démarrage.
import 'dotenv/config'
5 - 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 détecte les variables AZURE_CLIENT_IDd’environnement, AZURE_TENANT_IDet sont définies et AZURE_CLIENT_SECRET lisent ces variables pour obtenir les informations du principal du service d’application avec lesquelles se connecter à 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 :
- Importez la
DefaultAzureCredentialclasse à partir du@azure/identitymodule. - Créez un objet
DefaultAzureCredential. - Transmettez l’objet
DefaultAzureCredentialau constructeur d’objet client du Kit de développement logiciel (SDK) Azure.
Un exemple de cela est illustré dans le segment de code suivant.
// Azure authentication dependency
import { DefaultAzureCredential } from '@azure/identity';
// Azure resource management dependency
import { SubscriptionClient } from "@azure/arm-subscriptions";
// Acquire credential
const tokenCredential = new DefaultAzureCredential();
async function listSubscriptions() {
try {
// use credential to authenticate with Azure SDKs
const client = new SubscriptionClient(tokenCredential);
// get details of each subscription
for await (const item of client.subscriptions.list()) {
const subscriptionDetails = await client.subscriptions.get(
item.subscriptionId
);
/*
Each item looks like:
{
id: '/subscriptions/123456',
subscriptionId: '123456',
displayName: 'YOUR-SUBSCRIPTION-NAME',
state: 'Enabled',
subscriptionPolicies: {
locationPlacementId: 'Internal_2014-09-01',
quotaId: 'Internal_2014-09-01',
spendingLimit: 'Off'
},
authorizationSource: 'RoleBased'
},
*/
console.log(subscriptionDetails);
}
} catch (err) {
console.error(JSON.stringify(err));
}
}
listSubscriptions()
.then(() => {
console.log("done");
})
.catch((ex) => {
console.log(ex);
});
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.
Commentaires
Bientôt disponible : Tout au long de 2024, nous allons supprimer progressivement GitHub Issues comme mécanisme de commentaires pour le contenu et le remplacer par un nouveau système de commentaires. Pour plus d’informations, consultez https://aka.ms/ContentUserFeedback.
Envoyer et afficher des commentaires pour