基于Azure AD组限制Azure静态Web应用特定页面访问

问题背景 #

我司通过Azure静态Web应用托管Doxygen文档，已搭建Azure DevOps流水线自动部署文件，并完成以下配置：

• 配置应用注册和企业应用，仅允许我司Azure AD租户内的已认证用户访问
• 在企业应用中限制特定组的访问，此部分运行正常

当前目标 #

• Index.html → 允许所有已认证用户访问
• Venus.html → 仅允许Venus团队组访问
• Pluto.html → 仅允许Pluto团队组访问

已尝试操作 #

1. 在Azure AD中创建角色并分配给相关组
2. 配置staticwebapp.config.json如下，但指定组用户访问对应页面仍提示访问受限：

{
  "routes": [
    {
      "route": "/pluto*",
      "allowedRoles": [
        "pluto"
      ]
    },
    {
      "route": "/venus*",
      "allowedRoles": [
        "venus"
      ]
    },
    {
      "route": "*",
      "allowedRoles": [
        "authenticated"
      ]
    }
  ],
  "responseOverrides": {
    "401": {
      "statusCode": 302,
      "redirect": "/.auth/login/aad"
    }
  },
  "auth": {
    "identityProviders": {
      "azureActiveDirectory": {
        "registration": {
          "openIdIssuer": "https://login.microsoftonline.com/<redacted>/v2.0",
          "clientIdSettingName": "AZURE_CLIENT_ID",
          "clientSecretSettingName": "AZURE_CLIENT_SECRET"
        }
      }
    }
  }
}

补充信息 #

• 使用Azure Active Directory作为身份验证提供程序
• 通过企业应用的用户和组设置分配角色
• 已清除浏览器缓存

核心问题与修复方案 #

你的配置思路方向正确，但Azure静态Web应用不会自动将Azure AD组映射到应用角色，需补充配置让组信息在认证时传递到应用，同时确保角色映射准确。

具体修复步骤 #

1. 配置应用注册的组声明

   • 进入Azure AD的应用注册页面，找到目标应用后进入「令牌配置」
   • 点击「添加组声明」，勾选「安全组」，选择「组ID」或「组名称」（推荐组ID避免名称变更影响），同时勾选「将组声明为角色」
   • 保存配置

2. 调整staticwebapp.config.json配置

   • 确保allowedRoles中的值与Azure AD组的名称/ID完全匹配（选组ID就填ID，选名称就填名称）
   • 补充index.html的明确路由规则避免歧义，同时优化权限提示：

{
  "routes": [
    {
      "route": "/pluto*",
      "allowedRoles": ["Pluto团队组的名称/ID"]
    },
    {
      "route": "/venus*",
      "allowedRoles": ["Venus团队组的名称/ID"]
    },
    {
      "route": "/index.html",
      "allowedRoles": ["authenticated"]
    },
    {
      "route": "*",
      "allowedRoles": ["authenticated"]
    }
  ],
  "responseOverrides": {
    "401": {
      "statusCode": 302,
      "redirect": "/.auth/login/aad"
    },
    "403": {
      "statusCode": 403,
      "contentType": "text/html",
      "content": "<h1>访问被拒绝：你没有权限查看此页面</h1>"
    }
  },
  "auth": {
    "identityProviders": {
      "azureActiveDirectory": {
        "registration": {
          "openIdIssuer": "https://login.microsoftonline.com/<redacted>/v2.0",
          "clientIdSettingName": "AZURE_CLIENT_ID",
          "clientSecretSettingName": "AZURE_CLIENT_SECRET"
        },
        "login": {
          "loginParameters": ["scope=openid profile email"]
        }
      }
    },
    "requireAuthorization": true
  }
}

3. 验证企业应用的组分配

   • 进入企业应用页面，确认Venus和Pluto组已在应用的访问列表中；如果用角色映射，需确保组已分配到对应应用角色
   • 提示：如果直接用组ID/名称作为权限判断依据，无需额外创建Azure AD角色，直接填写组标识即可

4. 测试验证

   • 用Venus组用户访问Venus.html、Pluto组用户访问Pluto.html，确认可正常访问
   • 用非对应组的已认证用户访问，应触发403访问拒绝提示

备选方案 #

如果上述配置仍有问题，可考虑为Venus和Pluto文档分别创建独立的静态Web应用，每个应用单独配置企业应用的组访问限制。此方式更简单，但会增加资源管理成本，适合文档完全独立的场景。

内容的提问来源于stack exchange，提问作者João Oliveira