基于Microsoft Azure AD的React-Spring认证流故障排查

一、修复React端获取包含API权限的令牌 #

• 指定正确的请求范围
  你的MSAL请求仅获取了默认的openid、profile等范围，必须显式包含API的api://xxxx-api/Access.Api范围。修改useMsalAuthentication的配置：

  const { login, accounts } = useMsalAuthentication(InteractionType.Popup, {
    scopes: ["api://xxxx-api/Access.Api", "openid", "profile", "email"]
  });
  

  如果后续需要静默获取令牌（比如Axios拦截器中），也要确保acquireTokenSilent请求包含该范围：

  const tokenRequest = {
    account: accounts[0],
    scopes: ["api://xxxx-api/Access.Api"]
  };
  const response = await instance.acquireTokenSilent(tokenRequest);
  

• 确认Azure AD权限配置

  • 检查客户端应用的“API permissions”，确保Access.Api是委派权限（SPA属于用户上下文，只能使用委派权限），且已完成管理员同意。
  • 进入API应用的“Expose an API”，确认客户端应用已被添加到“Authorized client applications”列表中，确保权限关联生效。

• 角色不显示的处理
  角色不会出现在scp字段，而是在roles数组中。如果令牌无roles字段：

  • 进入Azure AD的“Enterprise applications”，找到你的API应用，在“Users and groups”中确认你的用户已被分配了User/Admin角色。
  • 确保使用的是v2.0端点（MSAL默认使用v2），v1端点的角色格式会有差异。

二、修复Spring后端令牌验证失败 #

• 配置正确的JWT验证参数
  在application.yml中确保配置匹配API应用的信息：

  spring:
    security:
      oauth2:
        resourceserver:
          jwt:
            issuer-uri: https://login.microsoftonline.com/{你的租户ID}/v2.0
            audience: api://xxxx-api # 必须和令牌中的aud字段完全一致
  

  可以通过本地解码令牌查看aud值，确保audience配置完全匹配。

• 权限与角色的校验逻辑
  在Spring接口中添加权限校验时，注意Spring Security的前缀规则：

  • 委派权限（scp字段）需要加SCOPE_前缀：

    @PreAuthorize("hasAuthority('SCOPE_api://xxxx-api/Access.Api')")
    

  • 角色（roles字段）默认会被添加ROLE_前缀，因此校验时可以用：

    @PreAuthorize("hasRole('Admin')") // 等价于hasAuthority('ROLE_Admin')
    

• 令牌有效性排查
  解码令牌确认以下信息：

  • aud字段等于API应用的client ID或暴露的API ID
  • iss字段为https://login.microsoftonline.com/{租户ID}/v2.0
  • exp字段时间晚于当前时间（令牌未过期）

额外排查步骤 #

• 清除浏览器缓存和MSAL的本地缓存，重新登录获取新令牌，避免旧令牌干扰。
• 虽然SPA推荐启用PKCE，但如果未启用，确保MSAL配置中未强制开启PKCE（默认SPA配置会自动启用，若手动关闭需确认配置正确）。
• 检查API应用的Manifest，确认accessTokenAcceptedVersion设置为2（适配v2.0端点的令牌格式）。

内容的提问来源于stack exchange，提问作者ping pong