Keycloak-angular: HttpInterceptor not working on 2.0.0

[rightisleft]

Bug Report or Feature Request (mark with an x)

- [X] bug report -> please search for issues before submitting

Versions.

@2.0.0
Angular 5.2

Repro steps.

1. Make Post to keycloak node
2. Inspect network calls in Chrome
3. Note missing Authorization header + bearer token

import { BrowserModule } from '@angular/platform-browser';
import {APP_INITIALIZER, NgModule} from '@angular/core';

import { AppComponent } from './app.component';
import { TreasureComponent } from './treasure/treasure.component';
import { LandingComponent } from './landing/landing.component';
import {appRoutes} from './app.routes';
import {HttpClientModule} from '@angular/common/http';
import {KeycloakAngularModule, KeycloakService} from 'keycloak-angular';
import {treasureInit} from './treasure-auth/treasure.authorization.initializer';
import {TreasureAuthorizationGuard} from './treasure-auth/treasure.authorization.guard';

@NgModule({
  declarations: [
    AppComponent,
    TreasureComponent,
    LandingComponent
  ],
  imports: [
    appRoutes,
    BrowserModule,
    HttpClientModule,
    KeycloakAngularModule
  ],
  providers: [
    TreasureAuthorizationGuard,
    {
      provide: APP_INITIALIZER,
      useFactory: treasureInit,
      multi: true,
      deps: [KeycloakService]
    }
  ],  bootstrap: [AppComponent]
})
export class AppModule { }

The AuthGuard works as expected, but the HttpInterceptors do not append the bearer token.

[Mihai-B]

It is the same for me, on angular version 6 and keycloak-angular 4.0.0-beta1

[rightisleft]

I wrote my own interceptor and it worked fine - i think it has something to do with how the interceptor is being declare in your common module

import { Injectable } from '@angular/core';
import {
  HttpRequest,
  HttpHandler,
  HttpEvent,
  HttpInterceptor
} from '@angular/common/http';
import {KeycloakService} from 'keycloak-angular';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/observable/fromPromise';
import 'rxjs/add/operator/mergeMap';


@Injectable()
export class TreasureAuthorizationInterceptor implements HttpInterceptor {
  constructor(public keycloak: KeycloakService) {}
  intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    return Observable.fromPromise(this.keycloak.getToken()).mergeMap(token => {
      const mod: HttpRequest<any> = request.clone({
        setHeaders: {
          Authorization: `Bearer ${token}`
        }
      });
      return next.handle(mod);
    });
  }
}

[Mihai-B]

I found the bug.
In your init options you have to set the disableBearerInterceptor to TRUE to actually have it enabled.

You should update the issue with the new info so it is more clear what it is happening here.

Also, having something set to 'true' to have it disabled is just bad practice(hence the bug). Will try to provide a fix for this if I have time this night

Also, my proposed solution would be to change the disableBearerInterceptor to enableBearerInterceptor and have it by default to true

[mauriciovigolo]

Hi @rightisleft and @Mihai-B and thanks for reporting the issue!
Sorry for not aswering this bug yesterday, I'm having a busy week.

When you mentioned the bug I thought about this new flag to disable the Bearer Interceptor and that this could be the cause.

Also, my proposed solution would be to change the disableBearerInterceptor to enableBearerInterceptor and have it by default to true

The behaviour should be: always add the bearer in the HttpClient requests but if the app doesn't need this feature there should be a flag to disable it. So it's better to leave the name like this, but we still need to fix this issue.

I will take a look tonight.

Thanks!

[Mihai-B]

Hi @mauriciovigolo ,

I am not saying to change the default behaviour, I am saying to change the property name to enableBearerInterceptor AND have it by default to true.(so by default the bearer interceptor is enabled)
The advantage of having the property this way is that we lose the double negative or also read here . It is bad practice and the code is hard to follow.

[mauriciovigolo]

@Mihai-B, I agree with your points, let's do it. Thanks!

[samherrmann]

I can confirm the same issue with the following stack:
angular: 6.0.0
keycloak: 3.4.3
keycloak-angular: 3.0.0

I agree with @Mihai-B that losing the double negative would be an improvement.

[mauriciovigolo]

New versions release, including this update suggested and coded by @Mihai-B!
@Mihai-B, thanks for your contribution to this project!
@rightisleft thanks for reporting the issues!