2016-08-11 8 views
0

Ich benutze auth0 und heruntergeladen die Quickstart-Beispiel-App von here. Ich versuche, das id_token zu bekommen, damit ich das Profil des Benutzers erhalten kann. Allerdings kann ich das nicht, da der Auth.service nach dem Laden meiner anderen Seiten läuft.auth0 mit angular2 - wie bekomme ich Token

So habe ich eine home.component wie folgt aus:

import { Component, OnInit } from '@angular/core'; 
import {Auth} from './auth.service'; 

@Component({ 
    selector: 'home', 
    template: ` 
    <h1>Testing</h1> 
    `, 
    providers: [Auth], 
}) 

export class HomeComponent implements OnInit { 

constructor(private auth: Auth) {} 

ngOnInit(){ 
    var token = localStorage.getItem('id_token'); 
    var profile = this.auth.lock.getProfile(token, function(error, profile) { 
    if (error) { 
     console.log("there was an ERROR" + error + token); 
     return; 
    }});  
    } 
} 

und meine auth.service Klasse, die wie folgt aussieht:

declare var Auth0Lock: any; 

@Injectable() 
export class Auth { 
// Configure Auth0 
lock = new Auth0Lock(mycreds, mycreds, {}); 

constructor() { 
    // Add callback for lock `authenticated` event 
    this.lock.on("authenticated", (authResult) => { 
    console.log("IN AUTH.SERVICE");  
    localStorage.setItem('id_token', authResult.idToken);     
    });   
} 

public login() { 
    // Call the show method to display the widget. 
    this.lock.show();   
}; 

public authenticated() { 
// Check if there's an unexpired JWT 
// This searches for an item in localStorage with key == 'id_token' 

return tokenNotExpired(); 
}; 

    public logout() { 
    // Remove token from localStorage 
    localStorage.removeItem('id_token'); 
    }; 
} 

das Problem ist, dass meine home.component Klasse Lasten vor meinem Dienst, wenn ich versuche, das Benutzer-Token zu bekommen, ist es noch nicht da. Ich bin ziemlich neu in eckigen, also bin ich mir nicht sicher, wie man eine Seite vor einer anderen lädt oder wie man dieses Problem löst.

+1

Haben Sie dieses https://github.com/auth0-samples/auth0-angularjs2-systemjs-sample/blob/master/04-User-Profile/ Beispiel gesehen. Es tut mir leid, aber ich frage mich, ob Sie Route Security in Ihrer eckigen App implementieren oder versuchen möchten, den besten Weg mit Auth0 zu finden. Der von mir bereitgestellte Link enthält einen aktualisierten "AuthService", der dieses Szenario behandelt. Wenn Sie allerdings die Routensicherheit implementieren möchten, sollten Sie sich einmal http://www.captaincodeman.com/2016/03/31/angular2-route-security/ – ShrekOverflow

+0

anschauen, das Beispiel in Ihrem ersten Link sieht so aus was ich möchte. Danke. – ygetarts

Antwort

1

Der Dienst wird instanziiert und der Konstruktor wird ausgeführt, bevor Ihr HomeComponents OnInit-Ereignis ausgelöst wird. Die Sache ist, dass Ihr Dienst auf eine Antwort (Auth) wartet, bevor er das Token setzt.

Das heißt - Sie können nicht erwarten, dass ein Token in Ihrem init auf der HomeComponent sein. Sie erhalten das Token nicht, bis sich der Benutzer über die Auth0Lock-Komponente aktiv angemeldet hat. Alles, was Sie in Ihrer HomeComponent tun können, ist Aufruf auth.login(). Da Ihr Benutzer auf dem Rückruf möglicherweise authentifiziert wurde, ist das Token möglicherweise vorhanden. Sie können Ihre HomeComponent überprüfen, ob das Token vorhanden ist (auth.authenticated()), bevor Sie die Profildaten anfordern.

Ein paar Fragen für Sie: 1. Haben Sie Ihre Konsole überprüft, wenn Sie Fehler bekommen? 2. Erhalten Sie jemals die Nachricht "IN AUTH.SERVICE" von Ihrem Authentifizierungsrückruf?

Verwandte Themen