Share via


Authentifizieren von Azure-Ressourcen aus lokalen JavaScript-Apps

Apps, die außerhalb von Azure ausgeführt werden (z. B. lokal oder im Rechenzentrum eines Drittanbieters), sollten einen Anwendungsdienstprinzipal verwenden, um sich bei Azure beim Zugriff auf Azure-Ressourcen zu authentifizieren. Anwendungsdienstprinzipalobjekte werden mithilfe des App-Registrierungsprozesses in Azure erstellt. Wenn ein Anwendungsdienstprinzipal erstellt wird, werden für Ihre App eine Client-ID und ein geheimer Clientschlüssel generiert. Sie speichern die Client-ID, den geheimen Clientschlüssel und Ihre Mandanten-ID in Umgebungsvariablen, sodass das Azure SDK für JavaScript die Umgebungsvariablen verwendet, um Ihre App zur Laufzeit bei Azure zu authentifizieren.

Für jede Umgebung (z. B. Test, Stufe, Produktion) sollte eine andere App-Registrierung erstellt werden. Dadurch können umgebungsspezifische Ressourcenberechtigungen für jeden Dienstprinzipal konfiguriert werden und sicherstellen, dass eine in einer Umgebung bereitgestellte App nicht mit Azure-Ressourcen spricht, die Teil einer anderen Umgebung sind.

1 - Registrieren der Anwendung in Azure AD

Eine App kann entweder mit dem Azure-Portal oder der Azure CLI bei Azure registriert werden.

Melden Sie sich beim Azure-Portal an, und führen Sie die folgenden Schritte aus.

Anweisungen Screenshot
Im Azure-Portal:
  1. Geben Sie auf der Suchleiste oben im Azure-Portal App Registrierungen ein.
  2. Wählen Sie im Menü, das unter der Suchleiste angezeigt wird, unter der Rubrik Dienste die Option App Registrierungen aus.
A screenshot showing how to use the top search bar in the Azure portal to find and navigate to the App registrations page.
Wählen Sie auf der Seite „App-Registrierungen“ die Option + Neue Registrierung aus. A screenshot showing the location of the New registration button in the App registrations page.
Füllen Sie auf der Seite Registrieren einer Anwendung das Formular wie folgt aus.
  1. Name → Geben Sie einen Namen für die App-Registrierung in Azure ein. Es wird empfohlen, dass dieser Name den App-Namen und die Umgebung (Test, Prod) enthält, für die die App-Registrierung vorgesehen ist.
  2. Unterstützte Kontotypen Nur Konten in diesem Organisationsverzeichnis.
Wählen Sie Registrieren aus, um Ihre App zu registrieren und den Anwendungsdienstprinzipal zu erstellen.
A screenshot to fill out Register by giving the app a name and specifying supported account types as accounts in this organizational directory only.
Auf der App-Registrierungsseite für Ihre App:
  1. Anwendungs-ID (Client) → Dies ist die App-ID, die Ihre App für den Zugriff auf Azure während der lokalen Entwicklung verwendet. Kopieren Sie diesen Wert an einen temporären Speicherort in einem Text-Editor, da Sie ihn in einem zukünftigen Schritt benötigen.
  2. Verzeichnis-ID (Mandant) → Dieser Wert wird auch von Ihrer App benötigt, wenn sie sich bei Azure authentifiziert. Kopieren Sie diesen Wert an einen temporären Speicherort in einem Text-Editor, da Sie ihn in einem zukünftigen Schritt benötigen.
  3. Clientanmeldeinformationen → Sie müssen die Clientanmeldeinformationen für die App festlegen, bevor Ihre App sich bei Azure authentifizieren und Azure-Dienste verwenden kann. Wählen Sie Zertifikat oder Geheimnis hinzufügen aus, um Anmeldeinformationen für Ihre App hinzuzufügen.
A screenshot of the App registration after completion. This screenshot shows the application and tenant IDs, which will be needed in a future step.
Wählen Sie auf der Seite „Zertifikate und geheime Schlüssel“ + Neuer geheimer Clientschlüssel aus. A screenshot showing the location of the link to use to create a new client secret on the certificates and secrets page.
Das Dialogfeld Geheimer Clientschlüssel hinzufügen wird auf der rechten Seite der Seite angezeigt. In diesem Dialog:
  1. Beschreibung → Geben Sie den Wert Current ein.
  2. Läuft aus→ Wählen Sie einen Wert von 24 Monaten aus.
Wählen Sie Hinzufügen aus, um das Geheimnis hinzuzufügen.

WICHTIG: Legen Sie eine Erinnerung in Ihrem Kalender vor dem Ablaufdatum des Geheimnisses fest. Auf diese Weise können Sie vor Ablauf dieses Geheimnisses ein neues Geheimnis hinzufügen und Ihre Apps aktualisieren und eine Dienstunterbrechung in Ihrer App vermeiden.
A screenshot showing the page where a new client secret is added for the application service principal created by the app registration process.
Auf der Seite "Zertifikate und geheime Schlüssel " wird der Wert des geheimen Clientschlüssels angezeigt.

Kopieren Sie diesen Wert an einen temporären Speicherort in einem Text-Editor, da Sie ihn in einem zukünftigen Schritt benötigen.

WICHTIG: Dies ist das einzige Mal, wenn dieser Wert angezeigt wird. Sobald Sie diese Seite verlassen oder aktualisieren, können Sie diesen Wert nicht mehr sehen. Sie können einen weiteren geheimen Clientschlüssel hinzufügen, ohne diesen geheimen Clientschlüssel ungültig zu machen, aber dieser Wert wird nicht mehr angezeigt.
A screenshot showing the page with the generated client secret.

2: Zuweisen von Rollen zum Anwendungsdienstprinzipal

Als Nächstes müssen Sie bestimmen, welche Rollen (Berechtigungen) Ihre App für welche Ressourcen benötigt, und diese Rollen Ihrer App zuweisen. Rollen können in einem Ressourcen-, Ressourcengruppen- oder Abonnementbereich eine Rolle zugewiesen werden. In diesem Beispiel wird gezeigt, wie Sie Rollen für den Dienstprinzipal auf der Ebene der Ressourcengruppe zuweisen, da die meisten Anwendungen alle ihre Azure-Ressourcen in einer einzigen Ressourcengruppe zusammenfassen.

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.
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.
Wählen Sie auf der Seite für die Ressourcengruppe im linken Menü Die Option Zugriffssteuerung (IAM) aus. A screenshot of the resource group page showing the location of the Access control (IAM) menu item.
Klicken Sie auf der Seite Zugriffssteuerungseinstellungen:
  1. Klicken Sie auf die Registerkarte Rollenzuweisungen.
  2. Wählen Sie im oberen Menü + Hinzufügen und aus dem dann angezeigten Dropdownmenü die Option Rollenzuweisung hinzufügen aus.
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.
Auf der Seite Rollenzuweisung hinzufügen werden alle Rollen aufgelistet, die der Ressourcengruppe zugewiesen werden können.
  1. 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.
  2. Wählen Sie die Rolle aus, die Sie zuweisen möchten.
    Klicken Sie auf Weiter, um zum nächsten Bildschirm zu wechseln.
A screenshot showing how to filter and select role assignments to be added to the resource group.
Auf der nächsten Seite Rollenzuweisung hinzufügen können Sie angeben, welchem Benutzer die Rolle zugewiesen werden soll.
  1. Wählen Sie unter Zugriff zuweisendie Option Benutzer, Gruppe oder Dienstprinzipal aus.
  2. Wählen Sie unter Mitglieder die Option +Mitglieder auswählen aus.
Ein Dialogfeld wird auf der rechten Seite des Azure-Portal geöffnet.
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.
Im Dialogfeld Mitglieder auswählen :
  1. 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 des Dienstprinzipals ein, den Sie für die App erstellt haben, um die Liste zu filtern.
  2. Wählen Sie den Dienstprinzipal aus, der Ihrer Anwendung zugeordnet ist.
Wählen Sie unten im Dialogfeld Auswählen aus, um den Vorgang fortzusetzen.
A screenshot showing how to filter for and select the Microsoft Entra group for the application in the Select members dialog box.
Der Dienstprinzipal 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.
A screenshot showing the completed Add role assignment page and the location of the Review + assign button used to complete the process.

3. Konfigurieren von Umgebungsvariablen für die Anwendung

Sie müssen die AZURE_CLIENT_IDVariablen AZURE_TENANT_IDund AZURE_CLIENT_SECRET Umgebungsvariablen für den Prozess festlegen, der Ihre JavaScript-App ausführt, um die Anmeldeinformationen des Anwendungsdienstprinzipals zur Laufzeit für Ihre App verfügbar zu machen. Das DefaultAzureCredential Objekt sucht nach den Dienstprinzipalinformationen in diesen Umgebungsvariablen.

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

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/Identitätspaket verwenden.

Fügen Sie zuerst 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.

// 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()
);

Wenn der obige Code das DefaultAzureCredential Objekt instanziiert, DefaultAzureCredential liest die Umgebungsvariablen AZURE_SUBSCRIPTION_ID, AZURE_TENANT_ID, , AZURE_CLIENT_IDund AZURE_CLIENT_SECRET für die Anwendungsdienstprinzipalinformationen, mit der eine Verbindung mit Azure hergestellt werden soll.