使用用户登录保护单页应用的安全

以下指南适用于托管在内容服务器上或具有最小 Web 服务器依赖项的应用程序。 应用程序仅向 Microsoft Entra 用户提供受保护的资源。 方案的目的是使 Web 应用程序能够进行身份验证以Microsoft Entra ID，并代表用户调用 Azure Maps REST API。

若要在 Azure 门户中查看 Azure Maps 帐户身份验证详细信息，请执行以下作：

1. 登录到 Azure 门户。

2. 导航到 Azure 门户菜单。 选择 “所有资源”，然后选择 Azure Maps 帐户。

3. 在左窗格中的 “设置” 下，选择“ 身份验证”。

   

创建 Azure Maps 帐户时会创建三个值。 它们用于在 Azure Maps 中支持两种类型的身份验证：

• Microsoft Entra 身份验证：表示 Client ID 要用于 REST API 请求的帐户。 该值 Client ID 应存储在应用程序配置中，然后在发出使用 Microsoft Entra 身份验证的 Azure Maps HTTP 请求之前检索该值。
• 共享密钥身份验证：Primary Key 和 Secondary Key 用作共享密钥身份验证的订阅密钥。 共享密钥身份验证依赖于将 Azure Maps 帐户生成的密钥与每个请求传递到 Azure Maps。 建议定期重新生成密钥。 若要在重新生成期间维护当前连接，请提供两个密钥。 一个密钥可以使用，同时重新生成另一个密钥。 重新生成密钥时，必须更新访问此帐户的任何应用程序以使用新密钥。 有关详细信息，请参阅 使用 Azure Maps 进行身份验证

在 Microsoft Entra ID 中创建应用程序注册

在 Microsoft Entra ID 中创建 Web 应用程序，以便用户登录。 Web 应用程序委托用户对 Azure Maps REST API 的访问权限。

1. 在 Azure 门户中的 Azure 服务列表中，选择 Microsoft Entra ID>应用注册>“新建注册”。

   

2. 输入 名称，选择 支持账户类型，并提供一个重定向 URI，该 URI 表示 Microsoft Entra ID 颁发令牌的 URL，也是托管地图控件的 URL。 有关详细示例，请参阅 Azure Maps Microsoft Entra ID 示例。 然后选择“注册”。

3. 若要将委派的 API 权限分配给 Azure Maps，请转到应用程序。 然后在 “应用注册”下，选择 “API 权限>添加权限”。 在 组织使用的 API 下，搜索并选择 Azure Maps。

   

4. 选中 “访问 Azure Maps”旁边的复选框，然后选择“ 添加权限”。

   

5. 启用 oauth2AllowImplicitFlow。 要启用该功能，请在应用程序注册的 清单 部分中，将 oauth2AllowImplicitFlow 设置为 true。

6. 从应用注册中复制 Microsoft Entra 应用 ID 和 Microsoft Entra 租户 ID，以在 Web SDK 中使用。 将 Microsoft Entra 应用注册详细信息和 x-ms-client-id 从 Azure Map 帐户添加到 Web SDK。

       <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. 为用户或组配置 Azure 基于角色的访问控制（Azure RBAC）。 请参阅 以下部分以启用 Azure RBAC。

向用户授予对 Azure Maps 的基于角色的访问权限

通过将 Microsoft Entra 组或安全主体分配到一个或多个 Azure Maps 角色定义，可授予 Azure 基于角色的访问控制 (Azure RBAC)。

若要查看 Azure Maps 的可用 Azure 角色定义，请参阅 “查看内置 Azure Maps 角色定义”。

有关如何将可用的 Azure Maps 角色分配给创建的托管标识或服务主体的详细步骤，请参阅 使用 Azure 门户分配 Azure 角色

若要有效地管理大量用户的 Azure Maps 应用和资源访问，请参阅 Microsoft Entra 组。

若要了解如何有效地管理用户的大型目录，请参阅 Microsoft Entra ID。

后续步骤

进一步了解单页应用程序场景：

查找 Azure Maps 帐户的 API 使用指标：

探索演示如何将 Microsoft Entra ID 与 Azure Maps 集成的示例：