Search code examples
authenticationangular6auth0keycloakvert.x

Auth0 authentication with Angular6


I have an Angular frontend and a restful Vertx backend and I am trying to let only authenticated users send requests to the backend.

For this I followed the example by Paul Bakker

Unfortunately he relies on the angular2-jwt library, which seems to be not compatible with Angular6...

How can I reqrite the following code to work in Angular6:

...
import { provideAuth } from 'angular2-jwt';
...

@NgModule({
  ...
  imports: [
    ...
  ],
  providers: [
    ...,
    provideAuth({
      globalHeaders: [{'Content-Type': 'application/json'}],
      noJwtError: true,
      tokenGetter: () => {
        return window['_keycloak'].token;
      }
    })],
  ...
})
...

I tried to use the @auth0/angular-jwt library. But that doesnt seem to work, as I get 401s from my backend server...

...
import { JwtModule } from '@auth0/angular-jwt';
...

@NgModule({
  ...
  imports: [
    ...,
    JwtModule.forRoot({
      config: {
        tokenGetter: () => {
          return window['_keycloak'].token;
        },
        whitelistedDomains: ['localhost:8080', 'localhost:8085']
      }
    })
  ],
  providers: [
	  ...
  ],
  ...
})
...


Solution

  • My Question has become irrelevant. The code actually works just fine the way I posted it. My problem was in the backend. The backend didnt properly parse and validate the JWT, which resulted in the 401 error...