2017-07-17 4 views
0

Also habe ich ein Tutorial auf der auth0-Website über das Erstellen eines Benutzerprofilsystems für meine App verfolgt, aber ich kann es nicht genau funktionieren. Ich bin an dem Punkt angelangt, an dem mein Login gut funktioniert, aber wenn Daten in die Benutzerprofile gezogen werden, will es einfach nicht funktionieren. Ich weiß nicht, wo ich von hier aus hingehen soll.ein Benutzerprofilsystem für angular 2 mit auth0 machen?

Tutorial im mit https://auth0.com/docs/quickstart/spa/angular2/02-user-profile

meinen Code zur Zeit ist

profile.components.html

<div class="panel panel-default profile-area"> 
    <div class="panel-heading"> 
     <h3>Profile</h3> 
    </div> 
    <div class="panel-body"> 
     <img src="{{profile?.picture}}" class="avatar" alt="avatar"> 
     <div> 
      <label><i class="glyphicon glyphicon-user"></i> Nickname</label> 
      <h3 class="nickname">{{ profile?.nickname }}</h3> 
     </div> 
     <pre class="full-profile">{{ profile | json }}</pre> 
    </div> 
</div> 

profile.components.ts

import { Component, OnInit } from '@angular/core'; 
import { AuthenticationService } from './../services/authentication.service'; 


interface User { 
    id: number, 
    name: string, 
    image: string 
} 

@Component({ 
    selector: 'db-profile', 
    templateUrl: 'app/profile/profile.component.html' 
}) 
export class ProfileComponent implements OnInit { 

    profile: any; 

    constructor(public auth: AuthenticationService) { } 

    ngOnInit() { 
     if (this.auth.userProfile) { 
      this.profile = this.auth.userProfile; 
     } else { 
      this.auth.getProfile((err, profile) => { 
       this.profile = profile; 
      }); 
     } 
    } 

} 

authentication.service.ts

// services/auth.service.ts 
import { Injectable, NgZone } from '@angular/core'; 
import {Router} from '@angular/router'; 
import { tokenNotExpired } from 'angular2-jwt'; 


// We want to avoid any 'name not found' 
// warnings from TypeScript 
declare var Auth0Lock: any; 

@Injectable() 
export class AuthenticationService { 
    constructor(private _router: Router, private _zone: NgZone) {} 

    lock = new Auth0Lock('gpnhOqi20kE7pOM61DYI6BuI93ZjgA4j', 'jasont8.auth0.com'); 

    login() { 
     this.lock.show((error: string, profile: Object, id_token: string) => { 
      if (error) { 
       console.log(error); 
      } 
      // We get a profile object for the user from Auth0 
      localStorage.setItem('profile', JSON.stringify(profile)); 
      // We also get the user's JWT 
      localStorage.setItem('id_token', id_token); 
     }); 
    } 

    logout() { 
     // To log out, we just need to remove 
     // the user's profile and token 
     localStorage.removeItem('profile'); 
     localStorage.removeItem('id_token'); 
    } 

    loggedIn() { 
     return tokenNotExpired(); 
    } 
} 

Antwort

0

Sie könnten diese

constructor(private auth: Auth) { 
    this.profile = JSON.parse(localStorage.getItem('profile')); 
    this.token = localStorage.getItem('id_token'); 
    console.log(this.profile);  
} 
versuchen wollen