2016-10-16 4 views
0

私はAuth0を使用して、NG2アプリケーションのユーザーを認証しています。私はAuthGuardをセットアップして、ユーザーがトークンなしでアプリケーションの特定のページにアクセスするのをブロックします。Auth0Lockオブジェクトでオプションを使用するとAngular2 Auth0トークンが格納されない

ロックウィジェットをオプションなしで使用すると、トークンは問題なくlocalStorageに保存されます。ただし、オプションを使用すると、localStorageには保存されません。

具体的にはいくつかのオプションを使用できますが、auth:とそのパラメータを追加すると、トークンはlocalStorageに保存されません。それはそれはlocalStorageにトークンを保存しませんオプションに追加されると

auth: { responseType: 'token', redirect: true, redirectUrl: "http://localhost/dashboard" }, 

これが問題の原因となる部分です。

ファイルauth.service.ts

import { Injectable }      from '@angular/core'; 
import { tokenNotExpired, JwtHelper }  from 'angular2-jwt'; 
import { Router }       from '@angular/router'; 
import { myConfig }      from './auth.config'; 

declare var Auth0Lock: any; 

var options = { 
    theme: { logo: '../assets/img/logo.png', primaryColor: '#779476' }, 
    auth: { responseType: 'token', redirect: true, redirectUrl: "http://localhost/dashboard" }, 
    languageDictionary: { emailInputPlaceholder: "[email protected]", title: "Login" }, 
}; 

@Injectable() 
export class Auth { 
    lock = new Auth0Lock(myConfig.clientID, myConfig.domain, options, {}); 

    constructor(private router: Router) { 
    this.lock.on('authenticated', (authResult) => { 
     localStorage.setItem('id_token', authResult.idToken); 
    }); 
    } 

    public login() { this.lock.show(); }; 
    public logout() { localStorage.removeItem('id_token'); }; 
    public authenticated() { return tokenNotExpired(); }; 
} 

ファイルguard.service.ts

import { Injectable }   from '@angular/core'; 
import { 
    CanActivate, 
    Router, 
    ActivatedRouteSnapshot, 
    RouterStateSnapshot 
}        from '@angular/router'; 
import { Auth }     from './auth.service'; 
import { Observable }   from 'rxjs/Observable'; 

@Injectable() 
export class Guard implements CanActivate { 

    constructor(protected router: Router, protected auth: Auth) {} 

    canActivate() { 
     if (localStorage.getItem('id_token')) { 
      // logged in so return true 
      return true; 
     } 
     // not logged in so redirect to login page 
     this.router.navigate(['/pages/home']); 
     return false; 
    } 
} 
+0

明示的な 'auth'オプションを渡さないと、' redirect'のデフォルト値は 'true'であり、 'responseType'は' token'なので、その原因は 'redirectUrl'です。これは、[ここ](http://stackoverflow.com/a/39701248/204699)に記載されている問題と同様のものでないかどうかを確認してください。 Angularがルートパラメータをクリアすると、トークンを保存するためにLockイベントが発生しないため、そうであるように見えます。 –

+0

@JoãoAngelo私に戻ってくれてありがとう。これは非常に混乱した問題であり、オプションでauthを使用する機能に関する情報はありません。どのようにこれがデフォルト動作を変更するか。しかし、私はトークンの削除によってデフォルトで返されることがわかりました。しかし、認証とトークンがtrueに設定されていないと、そうではありません。そこでauthを削除し、this.router.navigateByUrl( '/ dashboard')を追加しました。コンストラクタに渡し、ユーザが認証されると、ユーザを正しい場所にリダイレクトします。私はauthのこの振る舞いがより良く文書化される必要があると仮定します。 – wuno

答えて

0

あなたthis.lock設定でこれを変更するようにしてください。

auth: { 
    redirect:false, 
    } 

出典:

  • auth0.com/forum/t/authenticated-event-not-triggering/3554
  • github.com/auth0/lock/issues/527

リダイレクト機能を使用したい場合は、自分でリダイレクトすることができます。詳細については、こちらを参照してください:auth0.com/forum/t/callback-url-begins-with-hash/3694

関連する問題