Uwierzytelniaj się w Firebase przy użyciu kont opartych na hasłach i JavaScript

Możesz użyć uwierzytelniania Firebase, aby umożliwić użytkownikom uwierzytelnianie w Firebase przy użyciu adresów e-mail i haseł oraz zarządzać kontami aplikacji opartymi na hasłach.

Zanim zaczniesz

  1. Dodaj Firebase do swojego projektu JavaScript .
  2. Jeśli jeszcze nie połączyłeś aplikacji z projektem Firebase, zrób to z konsoli Firebase .
  3. Włącz logowanie za pomocą adresu e-mail/hasła:
    1. W konsoli Firebase otwórz sekcję Uwierzytelnianie .
    2. Na karcie Metoda logowania włącz metodę logowania E-mail/hasło i kliknij Zapisz .

Utwórz konto oparte na haśle

Aby utworzyć nowe konto użytkownika z hasłem, wykonaj następujące kroki na stronie rejestracji aplikacji:

  1. Gdy nowy użytkownik zarejestruje się za pomocą formularza rejestracji w Twojej aplikacji, wykonaj wszystkie kroki weryfikacji nowego konta wymagane przez aplikację, np. sprawdź, czy hasło do nowego konta zostało poprawnie wpisane i spełnia Twoje wymagania dotyczące złożoności.
  2. Utwórz nowe konto, przekazując adres e-mail i hasło nowego użytkownika do createUserWithEmailAndPassword :

    Web modular API

    import { getAuth, createUserWithEmailAndPassword } from "firebase/auth";
    
    const auth = getAuth();
    createUserWithEmailAndPassword(auth, email, password)
      .then((userCredential) => {
        // Signed up 
        const user = userCredential.user;
        // ...
      })
      .catch((error) => {
        const errorCode = error.code;
        const errorMessage = error.message;
        // ..
      });

    Web namespaced API

    firebase.auth().createUserWithEmailAndPassword(email, password)
      .then((userCredential) => {
        // Signed in 
        var user = userCredential.user;
        // ...
      })
      .catch((error) => {
        var errorCode = error.code;
        var errorMessage = error.message;
        // ..
      });
    Jeśli nowe konto zostało utworzone, użytkownik zostanie zalogowany automatycznie. Zapoznaj się z sekcją Następne kroki poniżej, aby uzyskać dane zalogowanego użytkownika.

    W tym miejscu można także wychwytywać i obsługiwać błędy. Listę kodów błędów znajdziesz w Dokumentach referencyjnych uwierzytelniania .

Zaloguj się za pomocą adresu e-mail i hasła

Kroki logowania użytkownika za pomocą hasła są podobne do kroków tworzenia nowego konta. Na stronie logowania aplikacji wykonaj następujące czynności:

  1. Gdy użytkownik loguje się do Twojej aplikacji, podaj adres e-mail i hasło użytkownika do signInWithEmailAndPassword :

    Web modular API

    import { getAuth, signInWithEmailAndPassword } from "firebase/auth";
    
    const auth = getAuth();
    signInWithEmailAndPassword(auth, email, password)
      .then((userCredential) => {
        // Signed in 
        const user = userCredential.user;
        // ...
      })
      .catch((error) => {
        const errorCode = error.code;
        const errorMessage = error.message;
      });

    Web namespaced API

    firebase.auth().signInWithEmailAndPassword(email, password)
      .then((userCredential) => {
        // Signed in
        var user = userCredential.user;
        // ...
      })
      .catch((error) => {
        var errorCode = error.code;
        var errorMessage = error.message;
      });
    Zapoznaj się z sekcją Następne kroki poniżej, aby uzyskać dane zalogowanego użytkownika.

    W tym miejscu można także wychwytywać i obsługiwać błędy. Listę kodów błędów znajdziesz w Dokumentach referencyjnych uwierzytelniania .

Zalecane: Włącz ochronę wyliczeń e-maili

Niektóre metody uwierzytelniania Firebase, które przyjmują adresy e-mail jako parametry, generują określone błędy, jeśli adres e-mail jest niezarejestrowany, gdy musi zostać zarejestrowany (na przykład podczas logowania się przy użyciu adresu e-mail i hasła) lub zarejestrowany, gdy musi być nieużywany (na przykład przy zmianie adresu e-mail użytkownika). Chociaż może to być pomocne w sugerowaniu użytkownikom konkretnych środków zaradczych, może zostać również wykorzystane przez złośliwych aktorów w celu wykrycia adresów e-mail zarejestrowanych przez użytkowników.

Aby zminimalizować to ryzyko, zalecamy włączenie ochrony e-maili w swoim projekcie za pomocą narzędzia Google Cloud gcloud . Pamiętaj, że włączenie tej funkcji zmienia sposób raportowania błędów przez uwierzytelnianie Firebase: upewnij się, że Twoja aplikacja nie opiera się na bardziej szczegółowych błędach.

Następne kroki

Gdy użytkownik zaloguje się po raz pierwszy, zostanie utworzone nowe konto użytkownika i powiązane z poświadczeniami — czyli nazwą użytkownika i hasłem, numerem telefonu lub informacjami o dostawcy uwierzytelniania — za pomocą których użytkownik się zalogował. To nowe konto jest przechowywane jako część Twojego projektu Firebase i może służyć do identyfikowania użytkownika w każdej aplikacji w Twoim projekcie, niezależnie od tego, w jaki sposób użytkownik się loguje.

  • W aplikacjach zalecanym sposobem sprawdzenia stanu uwierzytelnienia użytkownika jest ustawienie obserwatora w obiekcie Auth . Następnie można uzyskać podstawowe informacje o profilu użytkownika z obiektu User . Zobacz Zarządzanie użytkownikami .

  • W regułach bezpieczeństwa bazy danych Firebase Realtime i Cloud Storage możesz uzyskać unikalny identyfikator zalogowanego użytkownika ze zmiennej auth i użyć go do kontrolowania, do jakich danych użytkownik może uzyskać dostęp.

Możesz zezwolić użytkownikom na logowanie się do aplikacji przy użyciu wielu dostawców uwierzytelniania, łącząc poświadczenia dostawcy uwierzytelniania z istniejącym kontem użytkownika.

Aby wylogować użytkownika, wywołaj funkcję signOut :

Web modular API

import { getAuth, signOut } from "firebase/auth";

const auth = getAuth();
signOut(auth).then(() => {
  // Sign-out successful.
}).catch((error) => {
  // An error happened.
});

Web namespaced API

firebase.auth().signOut().then(() => {
  // Sign-out successful.
}).catch((error) => {
  // An error happened.
});