Javascript 在执行代码之前解析Angular2上的Http请求

在执行其他代码之前，我在尝试解析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'));

---

如何解决observable的异步问题

更改您的

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

---

*我没有运行此代码-因此可能会有错误，但它应该用于演示原理。

您不能<代码>订阅在请求成功完成时调用“成功回调”。因此，您必须在

saveToken

之后调用第二个代码，因为您可以看到getRefresh方法调用在赋值之前。我已经编辑了完整的第二个代码。变量cookie将为null，但saveToken方法应设置2个cookie，如下所示：saveToken（token）{[…]cookie.set（“access_-token”，token.access_-token，expireDate”）；cookie.set（“refresh_-token”，token.refresh_-token，1）；}

getRefresh

之前被调用。但是它在调用

subscribe

处理程序之前返回，因为它是异步的。这是一个大问题，因为我不知道如何处理与可观察对象的异步，我不能使用承诺！！！一种解决方案是使

getRefresh

返回一个

可观察的
（或
承诺
）。然后在调用者中，不继续代码，而是返回
getRefresh
，其中包含代码的处理程序取决于令牌。非常感谢！现在代码给了我一个关于getRefresh返回的错误。事实上，如果你使用subsubscribe，你不能返回一个可观察的，而是一个subscriber@TommasoBetti我认为更新后的版本应该几乎可以正常工作，尽管我还没有运行它。如果您发现此选项有用，请对此进行投票或将其标记为您的答案。this.getRefresh（Cookie.get（“refresh_token”））.flatMap（（result）=>{getResource（）；给了我一个错误。类型有问题