首页 > 解决方案 > Identity4Server 许多 SPA 客户端的最佳方法?

问题描述

嗨,我继承了这样的系统:

一个 Api 和许多 Fronts (spa),它们共享一个带有链接的通用菜单,以相互导航,但它们是不同的反应应用程序,具有不同的 url。用于验证 Api 的 Azure Active Directory 受 Bearer 令牌的保护。

像这样的东西:

在此处输入图像描述

现在,我有授权要求以及业务人员想要分配给每个用户的自定义权限,用于他们可以执行或不执行的操作以及可见性。

我想将 Identity4Server 与活动目录一起用作开放 id 提供程序。然后使用提供者 api 来获取自定义权限并将这些权限放入声明中。然后在需要指定角色和声明以完成权限规范的 Api impl 策略中。

像这样的东西:

在此处输入图像描述

Identity4Server 配置:

services.AddAuthentication()
                .AddOpenIdConnect("oidc", "OpenID Connect", options =>
                {
                    options.SignInScheme = IdentityServerConstants.ExternalCookieAuthenticationScheme;
                    options.SignOutScheme = IdentityServerConstants.SignoutScheme;
                    options.SaveTokens = true;
                    options.RequireHttpsMetadata = false;

                    options.Authority = "https://login.microsoftonline.com/tenant/";
                    options.ClientId = "ClientId";
                    options.ClientSecret = "ClientSecret";

                    options.TokenValidationParameters = new TokenValidationParameters
                    {
                        NameClaimType = "name",
                        RoleClaimType = "role"
                    };
                });

接口:

services
                .AddAuthentication(configure =>
                {
                    configure.DefaultAuthenticateScheme = JwtBearerDefaults.AuthenticationScheme;
                    configure.DefaultChallengeScheme = JwtBearerDefaults.AuthenticationScheme;
                })
                .AddJwtBearer(options =>
                {
                    options.Audience = "api";
                    options.Authority = "http://localhost:5000";
                    options.RequireHttpsMetadata = false;
                });

var clientsPolicy = new AuthorizationPolicyBuilder()
                .AddAuthenticationSchemes("Bearer")
                .AddRequirements(new ClaimsAuthorizationRequirement("ClientsModule", new[] { "1" }))
                .RequireRole("Admin")
                .Build();

            services.AddAuthorization(options =>
            {
                options.AddPolicy("Clients", clientsPolicy);
            });

对于反应应用程序,我使用这个 npm "oidc-client": "1.7.0" 和类似的方法https://medium.com/@franciscopa91/how-to-implement-oidc-authentication-with-react -context-api-and-react-router-205e13f2d49 客户端配置是:(提供者非常相似,唯一改变的是 url localhost:3001)

export const IDENTITY_CONFIG = {
    authority: "http://localhost:5000",
    clientId: "fronts",
    redirect_uri: "http://localhost:3000/signin-oidc",
    login: "http://localhost:5000/login",
    automaticSilentRenew: false,
    loadUserInfo: false,
    silent_redirect_uri: "http://localhost:3000/silentrenew",
    post_logout_redirect_uri: "http://localhost:3000/signout-callback-oidc",
    audience: "fronts",
    responseType: "id_token token",
    grantType: "password",
    scope: "openid api",
    webAuthResponseType: "id_token token"
};

如果用户登录到客户端 (localhost:3000) 前面然后导航到提供程序 (localhost:3001) 前面它不应该再次登录。为了实现这一点,我为所有前端配置了相同的客户端 ID,但我不知道这是否是正确的方法。现在我在身份服务器中的配置类是:

public static IEnumerable<Client> GetClients()
        {
            return new List<Client>
            {
                new Client
                {
                    ClientId = "fronts",
                    ClientSecrets =
                    {
                        new Secret("secret".Sha256())
                    },
                    ClientName = "All fronts",
                    AllowedGrantTypes = GrantTypes.Implicit,
                    AllowAccessTokensViaBrowser = true,

                    RedirectUris = { "http://localhost:3000/signin-oidc", "http://localhost:3001/signin-oidc" },
                    PostLogoutRedirectUris = { "http://localhost:3000/signout-callback-oidc", "http://localhost:3001/signout-callback-oidc" },
                    AllowedCorsOrigins = { "http://localhost:3000", "http://localhost:3001" },

                    AllowedScopes = new List<string>
                    {
                        IdentityServerConstants.StandardScopes.OpenId,
                        IdentityServerConstants.StandardScopes.Profile,
                        "api"
                    }
                }
            };
        }

您认为这种配置是正确的方法还是有更好的方法?

标签: c#reactjsasp.net-coresingle-page-applicationidentityserver4

解决方案


你提到

许多不同的反应应用程序,具有不同的网址

但在您的代码片段中,我只看到Clients(localhost:3000).

无论如何,协议规范告诉我们根据需要注册尽可能多的客户端。SSO 是身份提供者的主要职责。

您只需RequireConsent = false;在 IdSrv 中添加到您的客户端 def 以避免额外的意外用户交互。

此外,现在推荐的 spa-s 身份验证流程是“code+pkce”。您可以查看这篇文章以获得过渡的详细信息。


推荐阅读