如何使用 Angular -> Spring Boot Oauth2 -> Keycloak 获取 keycloak 令牌

Question

我有一个 Angular 应用程序作为前端，Spring Boot 作为后端技术，作为授权服务器，我使用的是 keycloak 12.0.4。

我不想将 keycloak 适配器用于 angular 和 spring boot，我想使用普通的 oauth2 oauth/token 以便我可以更改我的授权服务器，例如从 keycloak 到 okta 而无需大量更改代码。

我可以使用 postman 直接点击 keycloak token_endpoint 并通过传递用户名、密码、client_credentials 来获取令牌

http://localhost:8080/auth/realms/dev/protocol/openid-connect/token

但是如果我点击 token_endpoint 使用 angular，那么我会得到一个不同的 CROS 问题，我在 angular 中尝试了 proxy.config.json 并且还在 keycloak 中设置了 web-origin * 但这不起作用但基本上我不想要直接点击keycloak我想通过spring boot oauth2

CORS 已阻止从源“http://127.0.0.1:4200”访问“http://127.0.0.1:8080/auth/realms/dev/protocol/openid-connect/token”处的 XMLHttpRequest策略：请求的资源上不存在“Access-Control-Allow-Origin”标头。 login.component.ts:37 .

下面是我的 application.yml 文件

server:
  port: 8181
spring:
  application:
    name: cloudgateway
  security:
     oauth2:
      client:
        registration:
          keycloak:
            client-id: myadmin-service
            client-secret: 4c7388e6-a8d9-403a-a5d4-416be4163b93
            authorization-grant-type: authorization_code
            redirect-uri: "{baseUrl}/login/oauth2/code/{registrationId}"
            provider: keycloak
         provider:
           keycloak:
           token-uri: http://localhost:8080/auth/realms/dev/protocol/openid-connect/token
           issuer-uri: http://localhost:8080/auth/realms/dev
           authorization-uri: http://localhost:8080/auth/realms/dev/protocol/openid-connect/auth
           user-info-uri: http://localhost:8080/auth/realms/dev/protocol/openid-connect/userinfo
         resourceserver:
          jwt:
            issuer-uri: http://localhost:8080/auth/realms/dev
            jwk-set-uri: http://localhost:8080/auth/realms/dev/protocol/openid-connect/certs
 

Pom.xml

<dependencies>
    <dependency>
        <groupId>org.springframework.cloud</groupId>
        <artifactId>spring-cloud-starter-config</artifactId>
    </dependency>
    <dependency>
        <groupId>org.springframework.cloud</groupId>
        <artifactId>spring-cloud-starter-gateway</artifactId>
    </dependency>
    <dependency>
        <groupId>org.springframework.cloud</groupId>
        <artifactId>spring-cloud-starter-netflix-eureka-client</artifactId>
    </dependency>
    <dependency>
        <groupId>org.springframework.cloud</groupId>
        <artifactId>spring-cloud-starter-netflix-hystrix</artifactId>
    </dependency>
    <dependency>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-oauth2-client</artifactId>
    </dependency>
    <dependency>
        <groupId>org.springframework.cloud</groupId>
        <artifactId>spring-cloud-starter-security</artifactId>
    </dependency>
    <dependency>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-oauth2-resource-server</artifactId>
    </dependency>
    <dependency>
        <groupId>org.projectlombok</groupId>
        <artifactId>lombok</artifactId>
        <optional>true</optional>
    </dependency>
    <dependency>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-test</artifactId>
        <scope>test</scope>
        <exclusions>
            <exclusion>
                <groupId>org.junit.vintage</groupId>
                <artifactId>junit-vintage-engine</artifactId>
            </exclusion>
        </exclusions>
    </dependency>
</dependencies>

我在上面的 spring boot 上缺少什么配置。

Answer 1

您可以配置WebSecurity 以使用JwtAuthenticationToken（示例here 和there）填充安全上下文，但这种实现相当糟糕。

我编写了一个可移植的 OIDC Authentication 实现，其接口几乎与 KeycloakAuthenticationToken 一样丰富，但与任何 OpenID Connect 授权服务器兼容：OidcAuthentication（示例 here 和 there）

在 Angular 中，我使用 angular-auth-oidc-client，但 angular-oauth2-oidc 也应该没问题。

附： 这个 git repo 还包含注释，可以使用您选择的 Authentication 实现轻松填充 JUnit 安全上下文（请参阅 @WithMockOidcAuth、@WithMockJwtAuth 或 @WithMockKeycloakAuth）