javascript - documentacion - Angular 2: devuelve HTTP desde dentro de una promesa

page title angular 4

Question

Antes de cada llamada a http en mi servicio de API, quiero verificar mi almacenamiento local para obtener un token de acceso, luego realizar la llamada una vez que la tenga. Se parece a esto

read(endpoint,params?) {

    var url: string = this.authService.apiUrl + endpoint, 
        headers: Headers = new Headers(),
        queryString: URLSearchParams = new URLSearchParams();

    this.sessionService.getToken()
      .then((value) => {

        queryString.set(''access_token'', value);

        headers.append(''Content-Type'', ''application/json; charset=utf-8'');

        return this.http.get(url,{
          headers: headers, 
          search: queryString
        })
        .map(res => res.json())

      });


  }

Y en mi componente tendría algo así como

  getData() {
    this.apiService.read(''some endpoint'')
      .subscribe(
        res => console.log(res),
        error => this.logError(error)
      )
  }

Esto funcionó hasta que puse la llamada http dentro del archivo .then luego de verificar el almacenamiento local. Entonces creo que ahora está anidado incorrectamente.

¿Cuál es la forma correcta de evaluar esto? ¿Y hay una forma más eficiente de obtener mi token del almacenamiento local en esta configuración? NOTA: Estoy usando Ionic 2, que tiene su propia función para verificar el almacenamiento local que devuelve una promesa.

Cualquier consejo sería genial.

Gracias.

Answer 1

Tendrá que convertir el http observable en una promesa o convertir la promesa en un observable.

Observable para prometer:

read(endpoint,params?) {

    var url: string = this.authService.apiUrl + endpoint, 
        headers: Headers = new Headers(),
        queryString: URLSearchParams = new URLSearchParams();

    return this.sessionService.getToken() //return the outer promise
      .then((value) => {

        queryString.set(''access_token'', value);

        headers.append(''Content-Type'', ''application/json; charset=utf-8'');

        return this.http.get(url,{
          headers: headers, 
          search: queryString
        })
        .map(res => res.json()).toPromise() //use Observable.toPromise

      });


  }

Para llamar uso

this.apiService.read(''some endpoint'').then((data)=>{}).catch(err=>{})

Promesa a observable:

read(endpoint,params?) {

    var url: string = this.authService.apiUrl + endpoint, 
        headers: Headers = new Headers(),
        queryString: URLSearchParams = new URLSearchParams();

    return Observable.fromPromise(this.sessionService.getToken())//convert to Promise and return chain.
      .switchMap((value) => {//use Observable.switchMap to move to second observable

        queryString.set(''access_token'', value);

        headers.append(''Content-Type'', ''application/json; charset=utf-8'');

        return this.http.get(url,{
          headers: headers, 
          search: queryString
        })
        .map(res => res.json())

      });


  }