角度2の認証で観測値を処理する

Question

角度2のプロジェクトを開始したばかりで、認証を開始しようとしています。 this tutorialに触発され、私は次の操作を行うことを決めた。

• URLが呼ばれるたびに認証ロジックを処理するために（それを拡張する）カスタムRouterOutletクラスを作成します。

このカスタムクラスでは成功しましたが、ユーザーが認証されているかどうかを確認する方法はまだわかりません。

getAdmin() { 
    let headers = new Headers({ 'Content-Type': 'application/json' }); 
    let options = new RequestOptions({ headers: headers }); 
    return this.http.get('http://localhost:3000/admin/is_admin.json', options) 
     .map(res => res) 
     .catch(this.handleError) 
} 

このAPIの呼び出しは、trueまたはfalseを返します：私の状況は以下のように、私は次のように私の開発プロセスへのためにそれは、外部APIにget呼び出しを照会する必要があります。私はこの情報を使用するための最良の選択肢は何だろうと思っていましたか？私は例として与えた機能を使用する場合、私に観察が定義されていないので、私は、たとえば次の関数を呼び出す必要がありますURLをチェックする必要があります？：

isAdmin() { 
    this.getAdmin().subscribe(
     data => this.authenticationResult = data, 
     error => console.log("Error: ", error), 
     () => return JSON.parse(this.authenticationResult._data); 
} 

をするたびに私はこの稼働取得することはできません。

Answer 1

「問題」は、メソッドが非同期であるため、使用方法や注意を慎重にする必要があることです。

activateカスタムRouterOutletの方法で使用する場合は、オブザーバブルとリアクティブプログラミングを活用する必要があります。私は正確にあなたが管理者の役割を確認したい方法がわからない

：要求を最適化するために

activate(instruction: ComponentInstruction) { 
    return this.userService.getAdmin().flatMap((isAdmin) => { 
    if (this.userService.isLoggIn()) { 
     if (this._canActivate(instruction.urlPath, isAdmin) { 
     return Observable.fromPromise(super.activate(instruction)); 
     } else { 
     this.router.navigate(['Forbidden']); 
     return Observable.throw('Forbidden'); 
     } 
    } else { 
     this.router.navigate(['Login']); 
     return Observable.throw('Not authenticated'); 
    } 
    }).toPromise(); 
} 

_canActivate(url, admin) { 
    return this.publicRoutes.indexOf(url) !== -1 
    || this.userService.isLoggedIn(); 
} 

をユーザーがいる場合、あなたは怠惰（一度だけ）をチェックする要求を呼び出すことができます管理者かどうか：

isAdmin:boolean; 

getAdmin() { 
    if (this.isAdmin) { 
    return Observable.of(this.isAdmin); 
    } else { 
    let headers = new Headers({ 'Content-Type': 'application/json' }); 
    let options = new RequestOptions({ headers: headers }); 
    return this.http.get('http://localhost:3000/admin/is_admin.json', options) 
     .map(res => res) 
     .catch(this.handleError); 
    } 
} 

もう1つのアプローチは、ユーザーの認証時にこのヒントを読み込むことです。このようにして、activateメソッドの実装はより簡単になります。

activate(instruction: ComponentInstruction) { 
    if (this.userService.isLoggIn()) { 
    if (this.userService.isAdmin()) { 
     return super.activate(instruction); 
    } else if (this._canActivate(instruction.urlPath, isAdmin) { 
     return super.activate(instruction); 
    } else { 
     this.router.navigate(['Forbidden']); 
    } 
    } else { 
    this.router.navigate(['Login']); 
    } 
} 

_canActivate(url, admin) { 
    return this.publicRoutes.indexOf(url) !== -1 
    || this.userService.isLoggedIn(); 
} 

Answer 2

私はあなたのアプリの最初のステップとして何とかgetAdmin（）を呼び出し、その結果をDependency Injectionを使用して移動するSessionServiceオブジェクトに保存することを検討します。 getAdminの結果をチェックする必要があるときはいつでも、SessionServiceインスタンスに問い合わせることができます。 私はこれが助けてくれるといいですか