在执行代码之前解析Angular2上的Http Request

Question

我在执行其他代码之前尝试解析http.post请求时遇到问题。

这是地方：

  getRefresh(token){
    debugger;
    console.log("sono dentro get refresh");
    console.log(token);
    let params = new URLSearchParams();
    params.append('grant_type','refresh_token');
    params.append('refresh_token',token);
    params.append('client_id','web_app');

    let headers = new Headers({'Content-type': 'application/x-www-form-urlencoded; charset=utf-8','Authorization': 'Basic '+btoa("web_app:")});
    let options = new RequestOptions({headers: headers});

    this._http.post('http://localhost:9997/oauth/token',params.toString(),options)
      .map(res => res.json())
      .subscribe(
        data => this.saveToken(data),
        err => alert('Invalid Credentials')
      );
  }

通过浏览器控制台进行控制流之后，我注意到saveToken方法没有尽快执行。

事实是，我需要该方法来注册一些cookie，在此重复使用：

if (!Cookie.get("access_token")) { 
      this.getRefresh(Cookie.get("refresh_token"));
      cookie = Cookie.get("access_token");

    } else {

      cookie = Cookie.get("access_token");
    }

      var headers = new Headers({
        'Content-type': 'application/x-www-form-urlencoded; charset=utf-8',
        'Authorization': 'Bearer ' +  cookie                                 
      });

      var options = new RequestOptions({headers: headers});

      return this._http.get(resourceUrl, options)
        .map((res: Response) => res.text())
        .catch((error: any) => Observable.throw(error().json().error || 'Server error'));

如何解决可观察的异步问题？

Answer 1

更改您的getRefresh(token)方法以返回可观察到的值，并在调用代码中使用它：

function getRefresh(token) {
    debugger;
    console.log("sono dentro get refresh");
    console.log(token);
    let params = new URLSearchParams();
    params.append('grant_type', 'refresh_token');
    params.append('refresh_token', token);
    params.append('client_id', 'web_app');

    let headers = new Headers({ 'Content-type': 'application/x-www-form-urlencoded; charset=utf-8', 'Authorization': 'Basic ' + btoa("web_app:") });
    let options = new RequestOptions({ headers: headers });

    return this._http.post('http://localhost:9997/oauth/token', params.toString(), options)
        .map(res => res.json())
        .flatMap(
            data => this.saveToken(data),
            err => alert('Invalid Credentials')
        );
}

function getResource() {
    var cookie = Cookie.get("access_token");
    var headers = new Headers({
        'Content-type': 'application/x-www-form-urlencoded; charset=utf-8',
        'Authorization': 'Bearer ' + cookie
    });

    var options = new RequestOptions({ headers: headers });

    return this._http.get(resourceUrl, options)
        .map((res: Response) => res.text())
        .catch((error: any) => Observable.throw(error().json().error || 'Server error'));
}

function callingCodeFunction() {
    if (!Cookie.get("access_token")) {
        this.getRefresh(Cookie.get("refresh_token"))
            .flatMap((result) => {
                getResource();
            });
    } else {
        getResource()
    }
}

*我尚未运行此代码-可能会出现错误，但它应该有助于证明原理。