嵌套的Observable在Ionic2 / Angular2 App中表现不同

时间:2017-05-22 06:30:10

标签: javascript rest angular ionic2 rxjs

我正在创建一个离子登录模块,其中有2个observable,1个在另一个内,不确定这是否是正确的实现方式,

这里我试图调用getHTTP()方法,获取一个字符串,如果该字符串不为空,则将其设置为ionic-storage varaible,然后在登录前验证

由于Observables是异步的 - getHTTP()在登录流程(凭证)之后完成,请帮帮我

import { Injectable } from '@angular/core';
import { Http } from '@angular/http';
import 'rxjs/add/operator/map';
import {Observable} from 'rxjs/Observable';
import {Headers} from '@angular/http';
import {  Response } from '@angular/http';
import { Storage } from '@ionic/storage';


export class User {
  name: string;
  password: string;
  url: string;

  constructor(name: string, password: string, url: string) {
    this.name = name;
    this.password = password;
    this.url = url;
  }
}


/*
  Generated class for the AuthService provider.

  See https://angular.io/docs/ts/latest/guide/dependency-injection.html
  for more info on providers and Angular 2 DI.
*/
@Injectable()
export class AuthService {

  currentUser: User;
  data = '';

  constructor(public http: Http,private storage: Storage) {
    console.log('Hello AuthService Provider');
  }



  // Make a call to Get CSRF and check if we have access
  public getHTTP(credentials) {
        let responseCSRF ;
        const headers: Headers = new Headers();
        headers.append('Authorization', 'Basic ' + btoa(credentials.user + ':' + credentials.password));
        headers.append('Content-Type', 'application/json');
        console.log(headers);
        console.log('Clearing cache');
        this.storage.set('CSRF', '');
        this.storage.set('Auth',btoa(credentials.user + ':' + credentials.password));
        this.storage.set('url', credentials.url);
        //return
        responseCSRF = this.http.get('http://' + credentials.url +'/Windchill/servlet/rest/security/csrf', {
          headers: headers
        }).map((response: Response) =>  response.json());
        //console.log(typeof(responseCSRF))
        responseCSRF.subscribe(x => {
          console.log('CSRF ->' + x.items[0].attributes.nonce)
          this.data = x.items[0].attributes.nonce;
          if(typeof this.data!='undefined' && this.data) {
            this.storage.set('CSRF', this.data);
          }
        });
        return responseCSRF;
      }


  public login(credentials) {
       if (credentials.user === null || credentials.password === null || credentials.url === null ) {
         return Observable.throw("Please insert credentials ");
       } else {

        return Observable.create(observer => {
          // At this point make a request to your backend to make a real check!
          let access = false;
          this.getHTTP(credentials).subscribe (
          (resBody) => console.log('Boby is '+resBody),
          error => console.error('Error from auth-service: ' + error))
           ,  () => console.log('Completed!' + 'Auth' );

           this.storage.get('CSRF').then((val) => {
               console.log('Your CSRF is'+ val);
               if(val!='undefined') {
                 access = true;
               }
             });

          observer.next(access);
          observer.complete();
         });
       }
  }

public getUserInfo() : User {
  return this.currentUser;
}

public logout() {
  return Observable.create(observer => {
    this.currentUser = null;
    observer.next(true);
    observer.complete();
  });
}

}

在控制台中

Headers {_headers: Map(2), _normalizedNames: Map(2)}
auth-service.ts:49 Clearing cache
auth-service.ts:57 pluck -->[object Object]
auth-service.ts:83 Your CSRF is
auth-service.ts:59 CSRF ->RkPYp+UtGGMRB+8NJHCr9rJ6WhBHdIVCfim585xXKgZ1TKUmf3v39tBqVRkjSb93dgWi4oF3KF4rNts0c3frktUdIFokNNVrMSGM47V3KwQhP8A5ARKr5rBsaxtmOtI=
auth-service.ts:78 Boby is [object Object]

1 个答案:

答案 0 :(得分:1)

尝试将storage.get逻辑放在订阅处理程序中:

        return Observable.create(observer => {
            // At this point make a request to your backend to make a real check!
            let access = false;
            this.getHTTP(credentials).subscribe(
                (resBody) => {
                    console.log('Boby is ' + resBody);
                    this.storage.get('CSRF').then((val) => {
                        console.log('Your CSRF is' + val);
                        if (val != 'undefined') {
                            access = true;
                        }

                        observer.next(access);
                        observer.complete();
                    });
                },
                error => console.error('Error from auth-service: ' + error),
                () => console.log('Completed!' + 'Auth'));
        });