tokenNotExpiredメソッドによるauth0認証の問題

Question

私はangle2アプリケーションからauth0を使用して認証しようとしています。私は、データベースを使用auth0 IDプロバイダとして

import { Injectable } from '@angular/core'; 
import { tokenNotExpired } from 'angular2-jwt'; 
declare var Auth0Lock: any; 

@Injectable() 
export class AuthenticationService{ 

    //Configure Auth0 
    lock = new Auth0Lock('my_client_id', 'my_domain', {}); 

    //Store profile object in auth class 
    userProfile: Object; 

    constructor(){ 
     this.lock.on("authenticated", (authResult)=>{ 
      localStorage.setItem('id_token', authResult.idToken); 
      this.lock.getProfile(authResult.idToken, (error, profile) =>{ 
       if(error){ 
        console.log(error); 
        return; 
       } 
       localStorage.setItem('profile', JSON.stringify(profile)); 
       this.userProfile = profile; 
      }) 
     }); 
    } 

    public login(){ 
     console.log('Login'); 
     this.lock.show(); 
    } 

    public isAuthenticated(){ 
     console.log(tokenNotExpired()); 
     return tokenNotExpired(); 
    } 

    public logout(){ 
     localStorage.removeItem('profile'); 
     localStorage.removeItem('id_token'); 
     this.userProfile = undefined; 
    } 
} 

：ベローは（私がthisとthisとthisを使用したリソースとして）私の認証サービスです。私はAuth0ロックオブジェクト（私はトークンを受け取っています）を使用してログインを管理していますが、一部のボタンを非表示にするにはtokenNotExpired（）メソッドはログイン後も常にfalseを返します。

<button md-button (click)="login()" *ngIf="!authService.isAuthenticated()"> 
    <md-icon class="demo-toolbar-icon">input</md-icon> 
    Login 
</button> 

<button md-button (click)="logout()" *ngIf="authService.isAuthenticated()"> 
    Logout 
    <md-icon class="demo-toolbar-icon">exit_to_app</md-icon> 
</button> 

なぜtokenNotExpiredメソッドが常にfalseを返し、どのようにこの問題を解決して要素を表示/非表示できるのですか？

import { tokenNotExpired, AuthHttp, AuthConfig } from 'angular2-jwt'; 
declare var Auth0Lock: any; 

export function authHttpServiceFactory(http: Http, options: RequestOptions) { 
    return new AuthHttp(new AuthConfig({ 
     tokenName: 'id_token', 
     tokenGetter: (() => localStorage.getItem('id_token')) 
    }), http, options); 
} 

@NgModule({ 
    providers: [ 
    { 
     provide: AuthHttp, 
     useFactory: authHttpServiceFactory, 
     deps: [Http, RequestOptions] 
    } 
    ] 
}) 
@Injectable() 
export class AuthenticationService{ 

//Configure Auth0 
lock = new Auth0Lock('my_client_id', 'my_domain', {}); 

Answer 1

あなたがここにtokenGetterまたはカスタムトークン名、それを設定する方法例えばコンフィギュレーションを逃したと仮定すると：EDIT

は私が認証サービスに次のコードを追加しました。

興味深い部分は、tokenNameです。 id_tokenが実際のトークンであると仮定します。

トークンを取得するために他のロジックが必要な場合は、tokenGetterのコメントを外して必要に応じて実装します。

import { NgModule } from '@angular/core'; 
import { Http, RequestOptions } from '@angular/http'; 
import { AuthHttp, AuthConfig } from 'angular2-jwt'; 

export function authHttpServiceFactory(http: Http, options: RequestOptions) { 
    return new AuthHttp(new AuthConfig({ 
     tokenName: 'id_token', 
     //tokenGetter: (() => <whatEverStorage>.getItem('token')), 
    }), http, options); 
} 

@NgModule({ 
    providers: [ 
    { 
     provide: AuthHttp, 
     useFactory: authHttpServiceFactory, 
     deps: [Http, RequestOptions] 
    } 
    ] 
}) 
export class AuthModule {} 

Source