Warunek wstępny

$ NPM Zainstaluj --Save FireBase@4.11.0

Kwestia

Używam uwierzytelniania FireBase na mojej aplikacji internetowej. W mojej aplikacji, wdrożyłem onAuthStateChanged dla strony klienta JS jak poniżej.

firebase.auth().onAuthStateChanged((user) => {
  if(user) {
    //logged in
  } else {
    //do sth
  }
});

Po zalogowaniu potwierdziłem tę metodę zwrócić rzeczywisty użytkownik OBJ, ale jeśli odświeżę stronę, użytkownik może być null. Ciekawnie, czasami użytkownik nie będzie null. Obawiam się, że istnieją pewne ograniczenie dzwonienia Onauthstatechanged, ale obecnie nie mam pojęcia.

Jak mam poradzić sobie z tym problemem?

Aktualizacja

Pozwól mi podzielić się moim minimalnym przykładem.

Moja aplikacja działa z Express.js. Istnieją dwa adresy URL, takie jak poniżej. /login /main

Na stronie Logowanie wdrożono metodę uwierzytelniania. Jeśli logowanie zostanie pomyślnie zakończone, użytkownik zostanie przekierowany do "/ Main".

//login.js
import firebase from 'firebase';
var config = {...};
firebase.initializeApp(config);

var provider = new firebase.auth.GoogleAuthProvider();
firebase.auth().signInWithPopup(provider)
.then((result) => {
  return result.user.getIdToken(true);
}).then((idToken) => {
  if(idToken) {
    location.href = '/main';
  }
});

Na stronie głównej nie ma metody logowania. Main.js sprawdza tylko, czy użytkownik jest zalogowany.

//main.js
import firebase from 'firebase';
var config = {...};
firebase.initializeApp(config);

firebase.auth().onAuthStateChanged((user) => {
  if (user) {
    //initialize main page.
  } else {
    location.href = '/login';
  }
}

Myślę, że status logowania jest przechowywany na Localstorage przeglądarki internetowej. Oznacza to, że po zakończeniu załadunku Main.js, onauthstatechanged zostanie automatycznie zwolniony z informacjami użytkownika, ale nie działa, jak się spodziewałem. Jestem pewien, że trwałość informacji logowania jest poprawna, ponieważ oficjalny dokument mówi ustawienie domyślne to LOCAL dla klienta internetowego.

https://firebase.google.com/docs/auth/web/auth-state-persistence.

Moje pytanie

Czy powinienem wdrożyć onauthstatechanged z innym sposobem? Jak mogę zapewnić, że użytkownik jest zalogowany po przeładunku?

Na przykład

import $ from 'jquery';
$(document).on('ready', () => {
  onAuthStateChanged((user) => {...});
});

Czy możesz mi pokazać poprawny sposób?

Obejście problemu

Postanowiłem usunąć sesję i ustawić przekierowanie do strony logowania, jeśli wartość NULL zostanie zwrócona. To nie jest rozwiązanie, ale obejście obecnie ...

9
Osamu Tokita 4 czerwiec 2018, 18:19

3 odpowiedzi

Najlepsza odpowiedź

Nie dzwonisz onAuthStateChanged. Zamiast tego mówisz FireBase, aby zadzwonić Ty , gdy zmiany stanu uwierzytelniania, które mogą się zdarzyć kilka razy, gdy strona jest ponownie załadowana

Gdy strona zostanie załadowana, a wcześniej został wcześniej użytkownik, stan AUTS może zmienić kilka razy, podczas gdy klient określa się, jeśli stan uwierzytelniania użytkownika nadal jest ważny. Z tego powodu możesz Maj , zobacz połączenie bez użytkownika przed zobaczeniem ostatecznego połączenia z rzeczywistym podpisanym w użytkowniku.

4
Frank van Puffelen 4 czerwiec 2018, 15:40

Onauthstatechanged jest obserwatorem, jak stwierdzono w dokumentach FireBase, które zostaje wyzwolone, gdy stan AUTS zmienia się jak użytkownik podpisany, podpisany, zmiana PWD. Aby sprawdzić, czy użytkownik jest zalogowany, czy nie powinieneś użyć FireBase.auth (). Currencuser, który zapewni Ci aktualną zalogowaną użytkownika. Jak powiedziałeś, że twój stan jest lokalnym firebase.auth (). Currencuser zawsze daje użytkownik, chyba że użytkownik zostanie wylogowany.

1
pilku 6 czerwiec 2018, 14:15

Fakt, że czasami jest null, a czasami nie jest prawdopodobne, że nie ma problemu z asynchronem. Czy dokonujesz sprawdzenia w powyższym oświadczeniu IF? Wszystkie odniesienia do użytkownika powinny znajdować się w wywołaniu zwrotnym. Jeśli to wszystko się sprawdzi, może sprawdzić, czy uwierzytelnianie jest prawidłowo zainicjowane.

1
Will 4 czerwiec 2018, 15:28