Freigeben über

Schützen einer Single-Page-Webanwendung mit Benutzeranmeldung

  • Artikel

Die folgende Anleitung bezieht sich auf eine Anwendung, die auf einem Inhaltsserver gehostet wird oder nur minimale Webserverabhängigkeiten besitzt. Die Anwendung bietet nur Microsoft Entra-Benutzern geschützte Ressourcen. Das Ziel des Szenarios besteht darin, die Webanwendung für die Authentifizierung bei Microsoft Entra ID zu aktivieren und Azure Maps-REST-APIs im Auftrag des Benutzers aufzurufen.

So zeigen Sie Ihre Azure Maps-Kontoauthentifizierungsdetails im Azure-Portal an:

  1. Melden Sie sich beim Azure-Portal an.

  2. Navigieren Sie zum Menü des Azure-Portals. Wählen Sie Alle Ressourcen und dann Ihr Azure Maps-Konto aus.

  3. Wählen Sie im linken Bereich unter Einstellungen die Option Authentifizierung aus.

    Screenshot showing your Azure Maps authentication options in the Azure portal.

Bei der Erstellung des Azure Maps-Kontos werden drei Werte erstellt. Sie werden verwendet, um zwei Authentifizierungsarten in Azure Maps zu unterstützen:

  • Microsoft Entra-Authentifizierung: Die Client ID stellt das Konto dar, das für REST-API-Anforderungen verwendet werden soll. Der Wert Client ID sollte in der Anwendungskonfiguration gespeichert und später abgerufen werden, bevor Azure Maps-HTTP-Anforderungen mit Microsoft Entra-Authentifizierung übermittelt werden.
  • Authentifizierung über gemeinsam verwendete Schlüssel: Der Primärschlüssel (Primary Key) und der Sekundärschlüssel (Secondary Key) werden als Abonnementschlüssel für die Authentifizierung über gemeinsam verwendete Schlüssel verwendet. Bei der Authentifizierung über gemeinsam verwendete Schlüssel wird der durch das Azure Maps-Konto generierte Schlüssel bei jeder Anforderung an Azure Maps übergeben. Es wird empfohlen, die Schlüssel regelmäßig neu zu generieren. Um aktuelle Verbindungen während der Neugenerierung aufrechtzuerhalten, werden zwei Schlüssel bereitgestellt. Ein Schlüssel kann verwendet werden, während der andere neu generiert wird. Bei der Neugenerierung Ihrer Schlüssel müssen Sie alle Anwendungen, die auf dieses Konto zugreifen, so aktualisieren, dass die neuen Schlüssel verwendet werden. Weitere Informationen finden Sie unter Authentifizierung mit Azure Maps.

Erstellen einer Anwendungsregistrierung in Microsoft Entra ID

Erstellen Sie die Webanwendung in Microsoft Entra ID, damit Benutzer sich anmelden können. Die Webanwendung delegiert den Benutzerzugriff an Azure Maps-REST-APIs.

  1. Wählen Sie im Azure-Portal in der Liste der Azure-Dienste die Optionen Microsoft Entra ID>App-Registrierungen>Neue Registrierung aus.

    A screenshot showing application registration in Microsoft Entra ID.

  2. Geben Sie einen Namen ein, und wählen Sie einen Supportkontotyp aus. Geben Sie einen Umleitungs-URI an, der die URL darstellt, für die Microsoft Entra ID das Token ausstellt. Dies ist die URL, unter der das Kartensteuerelement gehostet wird. Ein detailliertes Beispiel finden Sie unter Azure Maps: Microsoft Entra ID-Beispiele. Klicken Sie anschließend auf Registrieren.

  3. Navigieren Sie zu der Anwendung, um Azure Maps die delegierten API-Berechtigungen zuzuweisen. Wählen Sie dann unter App-Registrierungen die Optionen API-Berechtigungen>Berechtigung hinzufügen aus. Suchen Sie unter Von meiner Organisation verwendete APIs die Option Azure Maps, und wählen Sie sie aus.

    Screenshot showing a list of APIs my organization uses.

  4. Aktivieren Sie das Kontrollkästchen neben Auf Azure Maps zugreifen, und wählen Sie dann Berechtigungen hinzufügen aus.

    Screenshot showing the request app API permissions screen.

  5. oauth2AllowImplicitFlowaktivieren. Um diese Einstellung zu aktivieren, legen Sie im Abschnitt Manifest Ihrer App-Registrierung oauth2AllowImplicitFlow auf true fest.

  6. Kopieren Sie die Microsoft Entra-App-ID und die Microsoft Entra-Mandanten-ID aus der App-Registrierung, um Sie im Web SDK zu verwenden. Fügen Sie die Microsoft Entra-App-Registrierungsdetails und die x-ms-client-id aus dem Azure Map-Konto dem Web SDK hinzu.

        <link rel="stylesheet" href="https://atlas.microsoft.com/sdk/javascript/mapcontrol/3/atlas.min.css" type="text/css" />
    <script src="https://atlas.microsoft.com/sdk/javascript/mapcontrol/3/atlas.min.js" />
    <script>
        var map = new atlas.Map("map", {
            center: [-122.33, 47.64],
            zoom: 12,
            language: "en-US",
            authOptions: {
                authType: "aad",
                clientId: "<insert>",  // azure map account client id
                aadAppId: "<insert>",  // azure ad app registration id
                aadTenant: "<insert>", // azure ad tenant id
                aadInstance: "https://login.microsoftonline.com/"
            }
        });
    </script>

  7. Konfigurieren Sie die rollenbasierte Azure-Zugriffssteuerung (Azure RBAC) für Benutzer oder Gruppen. Informationen zum Aktivieren von Azure RBAC finden Sie in den folgenden Abschnitten.

Gewähren von rollenbasierter Zugriffssteuerung für Benutzer in Azure Maps

Sie können die rollenbasierte Zugriffssteuerung in Azure (Azure RBAC) verwenden, indem Sie mindestens einer Azure Maps-Rollendefinition eine Microsoft Entra-Gruppe oder einen Sicherheitsprinzipal zuweisen.

Die verfügbaren Azure-Rollendefinitionen für Azure Maps finden Sie unter Anzeigen der integrierten Azure Maps-Rollendefinitionen.

Ausführliche Schritte zum Zuweisen einer verfügbaren Azure Maps-Rolle zur erstellten verwalteten Identität oder zum Dienstprinzipal finden Sie unter Zuweisen von Azure-Rollen über das Azure-Portal.

Informationen zum effizienten Verwalten des Zugriffs auf Azure Maps-Apps und -Ressourcen für eine Vielzahl von Benutzer*innen finden Sie unter Verwalten des Zugriffs auf Apps und Ressourcen mithilfe von Microsoft Entra-Gruppen.

Wichtig

Damit Benutzer*innen sich bei einer Anwendung authentifizieren können, müssen sie zuerst in Microsoft Entra ID erstellt werden. Weitere Informationen finden Sie unter Hinzufügen oder Löschen von Benutzer*innen mithilfe von Microsoft Entra.

Informationen zur effektiven Verwaltung eines großen Verzeichnisses für Benutzer*innen finden Sie in der Dokumentation mit grundlegenden Informationen zu Microsoft Entra ID.

Warnung

Integrierte Azure Maps-Rollendefinitionen bieten einen sehr umfangreichen Autorisierungszugriff auf viele Azure Maps-REST-APIs. Informationen, wie Sie den Zugriff auf APIs auf ein Mindestmaß beschränken, finden Sie unter Erstellen einer benutzerdefinierten Rollendefinition und Zuweisen der systemseitig zugewiesenen Identität zur benutzerdefinierten Rollendefinition. Dadurch wird die geringste Berechtigung aktiviert, die für den Zugriff der Anwendung auf Azure Maps erforderlich ist.

Nächste Schritte

Weitere Informationen zum Single-Page-Webanwendungsszenario:

Einzelseitenanwendung

Suchen der API-Nutzungsmetriken für Ihr Azure Maps-Konto:

Anzeigen von Nutzungsmetriken

Sehen Sie sich Beispiele an, die zeigen, wie Sie Microsoft Entra ID in Azure Maps integrieren:

Azure Maps-Beispiele