2016-04-19 14 views
8

Mam aplikację ionic2 i korzystam z Firebase i angularFire2. Chciałbym uzyskać bieżący stan uwierzytelnienia i bieżący obiekt/użytkownik auth z firebase za pomocą metody angularFire2.Jak uzyskać aktualnie zalogowany stan uwierzytelniony/użytkownik z angularfire2

Oto, co działa do tej pory - mogę uwierzytelnić użytkownika i zasubskrybować FirebaseAuthState, aby uzyskać obiekt użytkownika Facebook.

constructor(platform: Platform, private auth: FirebaseAuth) { 

    auth.subscribe((user: FirebaseAuthState) => { 
     if (user) { 
     // I could store user in localstorage, but I'd like to see an All Firebase solution 
     this.rootPage = TabsPage; 
     } else { 
     this.rootPage = LoginPage; 
     } 
    }); 

Teraz mogę tylko ustawić localstorage tutaj i buforować mój obiekt użytkownika, aby zapamiętać stan auth. Jednak jestem ciekawy, jak mogę korzystać z Firebase tylko bez mojego wdrożenia własnego, niestandardowego lokalnego klucza pamięci. Widzę, że Firebase przechowuje własny klucz localStorage, więc wie, że jest zalogowany.

Jak mogę uzyskać obiekt auth z kodu? Dodatkowo wypróbowałem wymieniony przykład w dokumentacji AngularFire2, aby renderować stan auth w szablonie - ale to daje mi błąd.

import {FirebaseAuth} from 'angularfire2'; 
@Component({ 
    selector: 'auth-status', 
    template: ` 
    <div *ng-if="auth | async">You are logged in</div> 
    <div *ng-if="!(auth | async)">Please log in</div> 
    ` 
}) 
class App { 
    constructor (@Inject(FirebaseAuth) public auth: FirebaseAuth) {} 
} 

Odpowiedz

4

Bieżący stan uwierzytelnienia jest dostępny od wtryskiwanego FirebaseAuth. Można uzyskać rzeczywiste dane auth auth.getAuth()

Patrz: https://github.com/angular/angularfire2/blob/master/src/providers/auth.ts#L99

+2

. ge Metoda tAuth zostanie usunięta. Powinieneś użyć metody auth subscribe, aby sprawdzić stan auth. – afmeva

+0

@afmeva Jak uzyskać userInfo? – sandrooco

+1

@Sandrooco Właśnie dodałem odpowiedź. Mam nadzieję, że działa dla ciebie – afmeva

15

teraz w celu uzyskania informacji o użytkowniku, trzeba zapisać się na uzyskanie informacji uwierzytelniania. Ex

constructor(public af: AngularFire) { 
    this.af.auth.subscribe(auth => console.log(auth));// user info is inside auth object 
    } 

auth obiekt będzie null jeśli auth państwo nie istnieje

+0

To jest moje podejście na moje pytanie: http://stackoverflow.com/questions/39205045/angularfire2-proper-approach-to-check- Jeśli użytkownik jest zalogowany, nie wiem, czy to właściwe podejście ... – sandrooco

+0

tak. Jest to podejście angularfire2 docs. Myślę, że jeśli chcesz dokonać transformacji danych auth, powinieneś użyć operatorów obserwujących, takich jak mapa, flatmap. Jednakże, ponieważ chcesz tylko sprawdzić informacje o użytkowniku, takie podejście jest w porządku. – afmeva

+0

Czy masz ten kod w funkcji konstruktora dla każdej strony, która wymaga informacji o użytkowniku? lub przechowywać dane użytkownika w pamięci/localStorage, a następnie pobrać je później? W moim przypadku prawie każda strona wymaga danych użytkownika (uid) dla elementów podobnych/komentarzy, więc zastanawiam się, czy istnieją skuteczne sposoby na odzyskanie danych użytkownika? –

15
  1. Import: import { AngularFireAuth } from 'angularfire2/auth';
  2. Inject: constructor(public afAuth: AngularFireAuth) { }
  3. Sprawdź:

    this.afAuth.authState.subscribe(res => { 
        if (res && res.uid) { 
        console.log('user is logged in'); 
        } else { 
        console.log('user not logged in'); 
        } 
    }); 
    
+0

Po wielu mylących samouczkach łączących 'AngularFire2' i' firebase', to właśnie działało po przeczytaniu o 'firebase.auth(). OnAuthStateChanged' z oficjalnych dokumentów firebase. – rtpHarry

+0

Naprawdę muszę napisać te rzeczy w każdym komponencie, aby napisać te rzeczy w zmiennej obserwowalnej? nie ma prostego sposobu dostępu bez tak wielu dodatkowych kodów w każdym pojedynczym komponencie tej informacji? – Budi

+0

@Budi No. Możesz napisać to raz w usłudze. Twoja usługa zasubskrybuje zmianę stanu, a następnie możesz ustawić zmienną stanu, która jest wygodna dla reprezentowania odpowiednich informacji o autorze dla twoich komponentów. Następnie możesz wprowadzić tę usługę do swoich komponentów. –

Powiązane problemy