angular - HTTP从带有Firebase Id_token的API获取Angular 4

我得到了一个firebase auth函数返回的承诺，我需要idtoken通过api进行授权。
我正在用一个可观察的设置http get-req。
当我运行代码的时候，我会得到一个“未经授权的401”。
我尝试在getdata函数之外运行getidtoken，尽管idtoken在控制台中保持“未定义”。
See this image of the console "undefined" message
我该如何解决这个问题？
服务：

    import { Component, OnInit, Inject, Injectable } from '@angular/core';
    import { HttpHeaders, HttpParams } from '@angular/common/http';
    import { HttpModule, Http, Response, RequestOptions } from "@angular/http";
    import * as firebase from 'firebase/app'; //Firebase SDK
    import { Observable } from "rxjs/Observable";
    import 'rxjs/Rx';
    import { AngularFireDatabase, FirebaseListObservable } from "angularfire2/database";
    import { Params } from "@angular/router/src";
    import { Headers } from '@angular/http';

    @Injectable()
    export class StoriesService implements OnInit {

      page: string;
      feed: string;
      hits: string;
      idToken: any;

      private stories: any;
      private savedObjects: any;
      private apiUrl = 'https://dev-api.byrd.news/v1/stories';


       constructor(private http: Http) {
    console.log("Yo! Stories!")
  }

  ngOnInit() { }

  fireAuth() {
    firebase.auth().currentUser.getIdToken(true).then((idToken) => {
      this.idToken = idToken;
    })
  }


  getData(page, feed, hits): Observable<any> {
    this.fireAuth();
    let headers = new Headers();
    headers.append('user_token', this.idToken);
    let params = new HttpParams()
      .set('page', page)
      .set('feed', feed)
      .set('hits', hits)
    //let options = new RequestOptionsArg({headers: headers, params:params});
    console.log(this.idToken, headers, params);
    return this.http
      .get(this.apiUrl, { params, headers })
      .map((response: Response) => {
        console.log("Breakthrough!")
        return response.json() || {};
      })
      .catch(this.handleError);
  }

  private handleError(error: Response) {
    return Observable.throw(error.statusText);
  }

组成部分：

 getStories() : void {
    this.storiesService.getData('0', 'latest','6')
    .subscribe(data => {
      console.log(data);
    })
  }
}

最佳答案

这在某种程度上适用于.flatmap（）函数：

export class StoriesService implements OnInit {

  private apiUrl = 'https://dev-api.byrd.news/v1/stories';

  constructor(private http: Http) {
    console.log("Yo! Stories!")
  }

  ngOnInit() { }

  getToken() {
    return Observable.fromPromise(firebase.auth().currentUser.getIdToken(true)
      .then((idToken) => {
        return idToken;
      }))
  }


  getData(page: string, feed: string, hits: string): Observable<any> {
    return this.getToken()
      .flatMap(idToken => {
        let headers = new Headers();
        headers.append('user_token', idToken);
        let params = new URLSearchParams();
          params.append('page', page);
          params.append('feed', feed);
          params.append('hits', hits);
        let options = new RequestOptions({ headers: headers, params: params });
        // console.log(this.idToken, options);
        console.log("Token: " + idToken);
        console.log(headers, params);
        return this.http
          .get(this.apiUrl, { params, headers })
          .map((response: Response) => {
            console.log("Breakthrough!")
            return response.json() || {};
          })
      })
      .catch(this.handleError);
  }

  private handleError(error: Response) {
    return Observable.throw(error.statusText);
  }