Angular 2 – Retorna o HTTP de dentro de uma promise

Antes de cada chamada http em meu serviço de API, quero verificar meu armazenamento local para um token de access e, em seguida, fazer a chamada assim que a tiver. Se parece com isso

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()) }); } 

E no meu componente eu teria algo parecido

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

Isso estava funcionando até que eu coloquei a chamada http dentro do .en depois de verificar o armazenamento local. Então eu acho que agora está nested incorretamente.

Qual é a maneira correta de avaliar isso? E há talvez uma maneira mais eficiente de pegar meu token do armazenamento local nessa configuração? OBSERVAÇÃO: Estou usando o Ionic 2, que possui sua própria function para verificar o armazenamento local que retorna uma promise.

Qualquer conselho seria ótimo.

Obrigado.

Você terá que converter o http observável em uma promise ou converter a promise em observável.

Observável 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 chamar o uso

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

Promessa para observável:

 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()) }); } 

Do RXJS 5.5 em diante:

Promessa para observável:

 read(endpoint,params?) { var url: string = this.authService.apiUrl + endpoint, headers: Headers = new Headers(), queryString: URLSearchParams = new URLSearchParams(); return fromPromise(this.sessionService.getToken())//import {fromPromise } from "rxjs/observables/fromPromise"; .pipe( switchMap((value) => {//import {switchMap} from 'rxjs/operators/switchMap'; queryString.set('access_token', value); headers.append('Content-Type', 'application/json; charset=utf-8'); return this.http.get(url,{ headers: headers, search: queryString }) }); ); }