angular - Angular 使用 angular-oauth2-oidc：有效令牌未存储在存储中

Question

我正在使用基于 Spring 的 Auth-Server 来创建 JWT。

   clients.jdbc(dataSource())
        .withClient("sampleClientId")
            .authorizedGrantTypes("implicit", "password", "authorization_code", "refresh_token")
            .scopes("read", "write", "foo")
            .autoApprove(false)
            .accessTokenValiditySeconds(3600)
            .redirectUris("xxx","http://localhost:8080/pmt/", "http://localhost:8080/pmt/index.html", "http://localhost:8080/login/oauth2/code/custom")

为了保护对 Auth-Server 的访问，我使用了 WebSecurityConfigurerAdapter：

public class ServerSecurityConfig extends WebSecurityConfigurerAdapter     
{
    @Override
    protected void configure(AuthenticationManagerBuilder auth)
            throws Exception {

        auth.eraseCredentials(false);
        auth.ldapAuthentication() ....;
    }
  ...
}

在客户端，我有一个 angular 应用程序，我在其中使用 angular-oauth2-oidc 来实现隐式流。

auth.service.ts：

export const authConfig: AuthConfig = {
  loginUrl: 'http://localhost:8080/pmtauth/oauth/authorize',
  redirectUri: 'http://localhost:8080/pmt/',
  clientId: 'sampleClientId',
  scope: 'read write foo',    
  responseType: 'id_token token',
  requireHttps: false,
  showDebugInformation: true,
  tokenEndpoint: 'http://localhost:8080/pmtauth/oauth/token/',
  oidc: false,
};

@Injectable()
export class AuthService {

  constructor(
    private route: ActivatedRoute,
    private http: HttpClient,
    private oauthService: OAuthService) {
      this.oauthService.configure(authConfig);
      this.oauthService.setStorage(sessionStorage);
      this.oauthService.tryLogin();
 }

  login() {
    this.oauthService.initImplicitFlow();
  }

  checkCredentials() {
    if (this.oauthService.getAccessToken() === null) {
      return false;
    }
    return true;
  }

 logout() {
    this.oauthService.logOut();
    location.reload();
  }

...}

app.module.ts：

@NgModule({
  bootstrap: [App],
  declarations: [
    App
  ],
 imports: [ // import Angular's modules
    BrowserModule,
    HttpClientModule,
   RouterModule,
    FormsModule,
    ReactiveFormsModule,
    NgaModule.forRoot(),
    NgbModule.forRoot(),
    OAuthModule.forRoot(),
    PagesModule,
        routing
  ],
  providers: [
    AppState,
    GlobalState,
    AuthService,
    { provide: OAuthStorage, useValue: sessionStorage },
    { provide: HTTP_INTERCEPTORS, useClass: JwtInterceptor, multi: true },
  ]

调用方法 initImplicitFlow() 后，将显示 Auth-Server 的登录页面。当我输入正确的凭据（在我的情况下为 LDAP 凭据）时，客户端给出的 redirectUri 被调用：

http://localhost:8080/pmt/#access_token=<Token here>
     &token_type=bearer
     &state=lfSUoxuFJdp7O59UNb0gtXQPOOzcIB4ege0GDnPc
     &expires_in=2162
     &organization=usernamempdDr
     &jti=742fed68-5af3-42f5-b0d9-b93433e28ef7

然后应用程序“重定向”到这个页面http://localhost:8080/pmt/#。

因此，正如我在 URL 中看到的那样，我从我的 Auth-Server 收到了一个有效的令牌，但是 angular-oauth2-oidc 没有提取它并将其放入会话存储中。getIdToken、getAccessToken、hasValidIdToken 等始终返回 null/false。我的日志中没有错误。我调试了 OAuthService 类，但从未调用 callOnTokenReceivedIfExists() 或 storeAccessTokenResponse()。

顺便说一句：我第一次在我的 Auth-Server 上调用 authorize - 方法时，我必须允许每个范围。这是隐式流的正常行为吗？

标签： angularspring-bootangular-oauth2-oidc