Authentifizieren von JavaScript-Apps bei Azure-Diensten während der lokalen Entwicklung mithilfe von Entwicklerkonten

Wenn Sie Cloudanwendungen erstellen, müssen Entwickler Anwendungen auf ihrer lokalen Arbeitsstation debuggen und testen. Wenn eine Anwendung während der lokalen Entwicklung auf der Arbeitsstation eines Entwicklers ausgeführt wird, muss sie sich weiterhin bei allen von der App verwendeten Azure-Diensten authentifizieren. In diesem Artikel wird beschrieben, wie Sie die Azure-Anmeldeinformationen eines Entwicklers verwenden, um die App während der lokalen Entwicklung bei Azure zu authentifizieren.

Damit eine App bei Azure während der lokalen Entwicklung mithilfe der Azure-Anmeldeinformationen des Entwicklers authentifiziert werden kann, muss der Entwickler über die Erweiterung Visual Studio Code Azure Tools, die Azure CLI oder Azure PowerShell bei Azure angemeldet sein. Das Azure SDK für JavaScript kann erkennen, dass der Entwickler von einem dieser Tools aus angemeldet ist, und dann die erforderlichen Anmeldeinformationen aus dem Anmeldeinformationscache abrufen, um die App bei Azure als angemeldeten Benutzer zu authentifizieren.

Dieser Ansatz ist am einfachsten für ein Entwicklungsteam einzurichten, da es die Vorteile der vorhandenen Azure-Konten der Entwickler nutzt. Das Konto eines Entwicklers verfügt jedoch wahrscheinlich über mehr Berechtigungen als für die Anwendung erforderlich, wodurch die Berechtigungen überschritten werden, mit denen die App in der Produktion ausgeführt wird. Alternativ können Sie Anwendungsdienstprinzipale erstellen, die während der lokalen Entwicklung verwendet werden können, die nur auf den Von der App benötigten Zugriff zugreifen können.

1 – Erstellen einer Microsoft Entra-Gruppe für die lokale Entwicklung

Da es fast immer mehrere Entwickler gibt, die an einer Anwendung arbeiten, empfiehlt es sich, zuerst eine Microsoft Entra-Gruppe zu erstellen, um die Rollen (Berechtigungen) zu kapseln, die die App in der lokalen Entwicklung benötigt. Dies bietet die folgenden Vorteile:

• Jedem Entwickler wird sichergestellt, dass dieselben Rollen zugewiesen werden, da Rollen auf Gruppenebene zugewiesen werden.
• Wenn eine neue Rolle für die App erforderlich ist, muss sie nur der Microsoft Entra-Gruppe für die App hinzugefügt werden.
• Wenn ein neuer Entwickler dem Team beitritt, muss er einfach der richtigen Microsoft Entra-Gruppe hinzugefügt werden, um die richtigen Berechtigungen für die Arbeit an der App zu erhalten.

Wenn Sie über eine microsoft Entra-Gruppe für Ihr Entwicklungsteam verfügen, können Sie diese Gruppe verwenden. Führen Sie andernfalls die folgenden Schritte aus, um eine Microsoft Entra-Gruppe zu erstellen.

Azure portal

Anweisungen	Screenshot
Navigieren Sie zur Microsoft Entra-ID-Seite im Azure-Portal, indem Sie Microsoft Entra-ID in das Suchfeld oben auf der Seite eingeben und dann Microsoft Entra-ID unter "Dienste" auswählen.
Wählen Sie auf der Seite "Microsoft Entra-ID" im linken Menü "Gruppen"aus.
Wählen Sie auf der Seite Alle GruppenNeue Gruppeaus.
Auf der Seite Neue Gruppe : Gruppentyp → Sicherheit. Gruppenname → Ein Name für die Sicherheitsgruppe, der in der Regel aus dem Anwendungsnamen erstellt wird. Es ist auch hilfreich, eine Zeichenfolge wie lokale Entwicklung in den Namen der Gruppe einzuschließen, um den Zweck der Gruppe anzugeben. Gruppenbeschreibung → Eine Beschreibung des Zwecks der Gruppe. Wählen Sie unter Mitglieder den Link Keine Mitglieder ausgewählt aus, um der Gruppe Mitglieder hinzuzufügen.
Das Dialogfeld Mitglieder hinzufügen wird angezeigt. Verwenden Sie das Suchfeld, um die Liste der Benutzernamen in der Liste zu filtern. Wählen Sie einen oder mehrere Benutzer für die lokale Entwicklung für diese App aus. Wenn Sie ein Objekt auswählen, wird das Objekt am unteren Rand des Dialogfelds zur Liste der ausgewählten Elemente verschoben. Wenn Sie fertig sind, wählen Sie die Schaltfläche "Auswählen" aus .
Wählen Sie auf der Seite Neue Gruppe die Option Erstellen aus, um die Gruppe zu erstellen. Die Gruppe wird erstellt, und Sie werden zur Seite Alle Gruppen zurückgeführt. Es kann bis zu 30 Sekunden dauern, bis die Gruppe angezeigt wird, und Sie müssen die Seite möglicherweise aktualisieren, da sie im Azure-Portal zwischengespeichert wird.

Azure-Befehlszeilenschnittstelle

Der Befehl "az ad group create " wird zum Erstellen von Gruppen in der Microsoft Entra-ID verwendet. Die --display-name- und --main-nickname-Parameter sind erforderlich. Der der Gruppe angegebene Name sollte auf dem Namen der Anwendung basieren. Es ist auch hilfreich, eine Zeichenfolge wie local-dev in den Namen der Gruppe aufzunehmen, um den Zweck der Gruppe anzugeben.

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

Zum Hinzufügen von Mitgliedern zur Gruppe benötigen Sie die Objekt-ID des Azure-Benutzers. Verwenden Sie die az ad user list , um die verfügbaren Dienstprinzipale aufzulisten. Der --filter Parameterbefehl akzeptiert OData-Formatfilter und kann verwendet werden, um die Liste wie gezeigt nach dem Anzeigenamen des Benutzers zu filtern. Der --query Parameter gibt angegebene Spalten zurück.

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

Der Befehl az ad group member add kann dann verwendet werden, um Gruppen Mitglieder hinzuzufügen.

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

2 – Zuweisen von Rollen zur Microsoft Entra-Gruppe

Als Nächstes müssen Sie bestimmen, welche Rollen (Berechtigungen) Ihre App für welche Ressourcen benötigt, und diese Rollen Ihrer App zuweisen. In diesem Beispiel werden die Rollen der In Schritt 1 erstellten Microsoft Entra-Gruppe zugewiesen. Rollen können in einem Ressourcen-, Ressourcengruppen- oder Abonnementbereich eine Rolle zugewiesen werden. In diesem Beispiel wird gezeigt, wie Rollen im Ressourcengruppenbereich zugewiesen werden, da die meisten Anwendungen alle ihre Azure-Ressourcen in einer einzelnen Ressourcengruppe gruppieren.

Azure portal

Anweisungen	Screenshot
Suchen Sie die Ressourcengruppe für Ihre Anwendung, indem Sie über das Suchfeld oben im Azure-Portal nach dem Namen der Ressourcengruppe suchen. Navigieren Sie zu Ihrer Ressourcengruppe, indem Sie den Namen der Ressourcengruppe unter der Überschrift Ressourcengruppen im Dialogfeld auswählen.
Wählen Sie auf der Seite für die Ressourcengruppe im linken Menü Die Option Zugriffssteuerung (IAM) aus.
Klicken Sie auf der Seite Zugriffssteuerungseinstellungen: Klicken Sie auf die Registerkarte Rollenzuweisungen. Wählen Sie im oberen Menü + Hinzufügen und aus dem dann angezeigten Dropdownmenü die Option Rollenzuweisung hinzufügen aus.
Auf der Seite Rollenzuweisung hinzufügen werden alle Rollen aufgelistet, die der Ressourcengruppe zugewiesen werden können. Verwenden Sie das Suchfeld, um die Liste auf eine besser verwaltbare Größe zu filtern. In diesem Beispiel wird gezeigt, wie Sie nach Storage-Blobrollen filtern. Wählen Sie die Rolle aus, die Sie zuweisen möchten. Klicken Sie auf Weiter, um zum nächsten Bildschirm zu wechseln.
Auf der nächsten Seite Rollenzuweisung hinzufügen können Sie angeben, welchem Benutzer die Rolle zugewiesen werden soll. Wählen Sie unter Zugriff zuweisendie Option Benutzer, Gruppe oder Dienstprinzipal aus. Wählen Sie unter Mitglieder die Option +Mitglieder auswählen aus. Ein Dialogfeld wird auf der rechten Seite des Azure-Portal geöffnet.
Im Dialogfeld Mitglieder auswählen : Das Textfeld Auswählen kann verwendet werden, um die Liste der Benutzer und Gruppen in Ihrem Abonnement zu filtern. Geben Sie bei Bedarf die ersten Zeichen der microsoft Entra-Gruppe für die lokale Entwicklung ein, die Sie für die App erstellt haben. Wählen Sie die lokale Entwicklungsgruppe Microsoft Entra aus, die Ihrer Anwendung zugeordnet ist. Wählen Sie unten im Dialogfeld Auswählen aus, um den Vorgang fortzusetzen.
Die Microsoft Entra-Gruppe wird auf dem Bildschirm "Rollenzuweisung hinzufügen" als ausgewählt angezeigt. Wählen Sie Überprüfen und zuweisen aus, um zur letzten Seite zu gelangen, und wählen Sie erneut Überprüfen und zuweisen aus, um den Vorgang abzuschließen.

Azure-Befehlszeilenschnittstelle

Einem Anwendungsdienstprinzipal wird mithilfe des Befehls az role assignment create eine Rolle in Azure zugewiesen.

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

Verwenden Sie den Befehl az role definition list , um die Rollennamen abzurufen, denen ein Dienstprinzipal zugewiesen werden kann.

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

Um beispielsweise den Anwendungsdienstprinzipal mit der appId des 00000000-0000-0000-0000-000000000000 Lese-, Schreib- und Löschzugriffs auf Azure Storage-Blobcontainer und -Daten auf alle Speicherkonten in der Ressourcengruppe "msdocs-sdk-auth-example " zuzulassen, weisen Sie den Anwendungsdienstprinzipal der Rolle "Storage Blob Data Contributor " mithilfe des folgenden Befehls zu.

az role assignment create --assignee "00000000-0000-0000-0000-000000000000" \
    --scope /subscriptions/"Storage Blob Data Subscriber" \
    --role "Storage Blob Data Contributor" \
    --resource-group "msdocs-sdk-auth-example"

Informationen zum Zuweisen von Berechtigungen auf Ressourcen- oder Abonnementebene mithilfe der Azure CLI finden Sie im Artikel Zuweisen von Azure-Rollen mithilfe der Azure CLI.

3 – Melden Sie sich mit VS Code, Azure CLI oder Azure PowerShell bei Azure an.

Azure PowerShell

Öffnen Sie ein Terminal auf Ihrer Entwicklerarbeitsstation, und melden Sie sich von Azure PowerShell bei Azure an.

Connect-AzAccount

4. Implementieren von DefaultAzureCredential in Ihrer Anwendung

Um Azure SDK-Clientobjekte für Azure zu authentifizieren, sollte Ihre Anwendung die DefaultAzureCredential Klasse aus dem @azure/identity Paket verwenden. In diesem Szenario wird sequenziell überprüft, DefaultAzureCredential ob sich der Entwickler mit der Erweiterung VS Code Azure Tools, azure CLI oder Azure PowerShell bei Azure angemeldet hat. Wenn der Entwickler mit einem dieser Tools bei Azure angemeldet ist, werden die zum Anmelden beim Tool verwendeten Anmeldeinformationen von der App verwendet, um sich bei Azure zu authentifizieren.

Fügen Sie zunächst das @azure-/Identitätspaket zu Ihrer Anwendung hinzu.

npm install @azure/identity

Als Nächstes sollten Sie für jeden JavaScript-Code, der ein Azure SDK-Clientobjekt in Ihrer App erstellt, Folgendes ausführen:

1. Importieren Sie die DefaultAzureCredential Klasse aus dem @azure/identity Modul.
2. Erstellen eines DefaultAzureCredential-Objekts
3. Übergeben Sie das DefaultAzureCredential Objekt an den Azure SDK-Clientobjektkonstruktor.

Ein Beispiel dafür wird im folgenden Codeausschnitt gezeigt.

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 erkennt automatisch den für die App konfigurierten Authentifizierungsmechanismus und ruft die erforderlichen Token ab, um die App bei Azure zu authentifizieren. Wenn eine Anwendung mehrere SDK-Clients verwendet, kann dasselbe Anmeldeinformationsobjekt mit jedem SDK-Clientobjekt verwendet werden.