Как отправить угловую форму с Http Interceptor - PullRequest
Новая
       38

Как отправить угловую форму с Http Interceptor

0 голосов
/ 13 ноября 2018

Знаете ли вы, как я могу отправить свою форму, используя HttpInterceptor?Мой метод GET это нормально, используя перехватчик, получающий токен и приносящий результат и т.д. ... но когда я пытаюсь отправить свою форму, ничего не происходит, сервер не вызывается.

TokenInterceptor.ts 

@Injectable()
export class TokenInterceptor implements HttpInterceptor {

  constructor(private kcService: KeycloakService) {}

  intercept(request: HttpRequest<any>, next: HttpHandler) : Observable<HttpEvent<any>>{
    return from(this.kcService.init())
      .pipe(switchMap(authToken => {
        debugger;
        if(authToken){
          const headers = request.headers
            .set('Authorization', 'Bearer ' + authToken)
            .append('Content-Type', 'application/json');
          console.log(authToken);
          const reqClone = request.clone({
            headers
          });
          return next.handle(reqClone);
        }
      }));
  }

}

ItemService.ts 

@Injectable()
export class ItemService {

    itensUrl = 'http://localhost:8080/itens'

    constructor(private http: HttpClient, private kcService: KeycloakService) { }

    list(){
     return this.http.get<any[]>(this.itensUrl);
    }

    addiction(item: any){
      return this.http.post(this.itensUrl, item);
    }
  }

app.modules.ts: 

 providers: [
    ItemService,
    KeycloakService,
    {
      provide: HTTP_INTERCEPTORS,
      useClass: TokenInterceptor,
      multi: true
    }

ItemPatrimonyComponent.ts 

export class ItemPatrimonyComponent implements OnInit {

  itens = [];

  constructor(private itemService: ItemService) { }

  ngOnInit() {
    this.listAll();
  }

  listAll(){
    this.itemService.list().subscribe(data => this.itens = data)
    console.log(this.itens);
  }

  add(frm:FormControl){
    this.itemService.addiction(frm.value)
      .subscribe(() => {
        frm.reset();
        this.listAll();
       });
  }

1 Ответ

0 голосов
/ 14 ноября 2018

Проблема в функции инициализации Keycloak, и вы не можете отладить свою проблему, потому что на перехватчике вы добавляете отладчик внутри функции обратного вызова init, а не снаружи. Если вызывается init и обновляется страница (что делает keycloak), вы никогда не увидите, как работает отладчик обратного вызова, вам нужно обратиться к службе keycloak вместо прямого вызова init, чтобы убедиться, что токен уже определен, если он возвращает токен вместо этого. вызова keycloak.init на каждый запрос. Что-то вроде: 

if (this.keycloak.token) {
  return Promise.resolve(this.keycloak.token);
}
return this.keycloak.init().then(()=> this.keycloak.token)
...