[使用IdentityServer 4中的授权码流保护公共API的安全

Question

我在应用程序中坚持一个非常基本的要求。这是我的情况。我正在使用angular作为前端并使用rest API作为后端来构建自定义电子商务门户。我有一个产品列表API，我的有角度的客户端应用程序将在没有用户凭据的情况下调用该产品列表API，因为产品列表是公共页面。但是，我不希望其他人使用我的产品详情API。我知道我可以使用客户端ID和客户端密码来获取令牌，并使用Identityserver 4使我的API安全，但是，如何避免在有角度的应用程序中暴露客户端密码？任何人都可以很容易地窃取它。是否可以通过PKCE将授权代码流用于公开我的API（例如不需要用户ID和密码的产品列表API）？

Answer 1

对我来说，解决此问题的最佳方法是回到Authorization Code flow的定义。授权码授予是用于获取访问令牌和刷新令牌的基于重定向的流，客户端通过定向资源所有者的流来启动该流。

pkce只是对授权码流程的扩展，可以防止某些攻击。

那么答案是否定的，如果没有用户登录，我们将无法在PKCE中使用授权码流程来保护公共API。还有其他一些方法可以保护公共API的安全，或者至少可以减少/增加对其的访问。 CORS是一个选项，请阅读更多here，因为在此问题之外，我将不做进一步介绍。

对于具有登录名的方案，IdentityServer4支持授权代码流。这是我们需要执行的操作：

1. 在IdentityServer上添加js客户端的配置条目，例如：

new Client
{
   ClientId = "jsclient",
   ClientName = "JavaScript Client",
   AllowedGrantTypes = GrantTypes.Code,
   RequirePkce = true,
   RequireClientSecret = false,
   RedirectUris =  { "http://localhost:5003/callback.html" },
   PostLogoutRedirectUris = { "http://localhost:5003/index.html" },
   AllowedCorsOrigins =
   { 
       "http://localhost:5003" 
   },
   AllowedScopes = {"openid", "profile", "offline_access", "api1", "api2" },
}

2. 在SPA应用程序上，使用[oidc-client`（https://github.com/IdentityModel/oidc-client-js/）库，并添加OIDC配置，例如

var config = {
    authority: "http://localhost:5000",
    client_id: "js",
    redirect_uri: "http://localhost:5003/callback.html",
    response_type: "code",
    scope:"openid profile api1",
    post_logout_redirect_uri : "http://localhost:5003/index.html",
};
var mgr = new Oidc.UserManager(config);

查找完整的示例代码here。我强烈建议阅读quickstart doc以更好地理解实现细节。

Answer 2

您应该通过插入广泛使用的OIDC Client库在Angular App中实现授权代码流（PKCE）-它的UserManager类将为您完成工作。

有关如何使用它的示例，请参阅我的这些资源：

• Visual Tutorial Write Up
• Code Sample
• Authorization Code Flow PKCE Code