2017-10-23 3 views
0

Ich habe eine funktionierende Backend JWT Setup auf meinem PHP-Server, und ich habe endlich nach vielen Stunden ein Ergebnis zu loggen Konsole für angular, was ich kann jetzt herausfinden, wie dieses Ergebnis zu verwalten und warten, bis die Information geladen ist, um ein Ergebnis zurückzugeben. Wenn ich meine Subskriptionsfunktion entferne, kann ich nicht einmal Ergebnisse rendern, die mich verwirren. Warum kann ich nicht einfach Map benutzen?JWT mit Angular 2 richtig verwenden

Wie auch immer, hier ist meine Login-Funktion:

login(username: string, password: string): Observable<boolean> { 
     let result = false; 
     var postData = "email=" + username + "&password=" + password; 
     let headers: Headers; 
     headers = new Headers(); 
     headers.append('Content-Type', 'application/x-www-form-urlencoded'); 

     this.http.post('https://callum.tech/jwt/', postData, {headers: headers}) 
      .take(1) 
      .map((res:any) => res.json()) 
      .subscribe(
       data => { 
        console.log(data.token) 
        if (data.token) { 
         console.log("token exists"); 
         // set token property 
         this.token = data.token; 

         // store username and jwt token in local storage to keep user logged in between page refreshes 
         localStorage.setItem('currentUser', JSON.stringify({ username: username, token: data.token })); 
         result = true; 
        } 
       }, 
       err => {console.log(err)} 
       //,() => console.log("done!?") 
      ); 
     console.log(result); 
     return Observable.of(result); 
    } 

Jetzt werden diese mit den richtigen Informationen anmelden (kehre ich eine json in PHP unter ‚token‘ und es gibt keine Probleme, ist dies in der Konsole angezeigt)

enter image description here

ich bin nicht sicher, wie zu warten und die richtige Antwort erhalten, scheint das POST Zeug mit Abonnement etc oder es wird nicht post-Daten wirklich empfindlich zu sein, so dass ich bin mir nicht sicher, wie zu behandeln dies

Antwort

1

Observable.map bildet nur die aufgelöste Antwort ab, die Anforderung wird nicht gestartet. Sie müssen immer subscribe verwenden, um es zu starten. So funktionieren Observables.

Auch der Code ist asynchron, Sie können nicht die console.log(result); am Ende Ihres Schnipsel, diese Zeile wird sofort nach dem Erstellen der beobachtbaren über this.http.post()... ausgeführt werden.

Lesen Sie die Dokumentation für weitere Informationen:

https://angular.io/guide/http

https://xgrommx.github.io/rx-book/content/getting_started_with_rxjs/creating_and_querying_observable_sequences/creating_and_subscribing_to_simple_observable_sequences.html

https://scotch.io/tutorials/angular-2-http-requests-with-observables