Uwierzytelniaj się w Firebase za pomocą kont opartych na hasłach za pomocą JavaScript

Zadbaj o dobrą organizację dzięki kolekcji Zapisuj i kategoryzuj treści zgodnie ze swoimi preferencjami.

Możesz użyć uwierzytelniania Firebase, aby umożliwić użytkownikom uwierzytelnianie się w Firebase przy użyciu ich 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 aplikacja nie została jeszcze połączona z projektem Firebase, zrób to z konsoli Firebase .
  3. Włącz logowanie przez e-mail/hasło:
    1. W konsoli Firebase otwórz sekcję Auth .
    2. Na karcie Metoda logowania włącz metodę logowania przez 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 czynności na stronie rejestracji aplikacji:

  1. Gdy nowy użytkownik zarejestruje się za pomocą formularza rejestracji Twojej aplikacji, wykonaj wszystkie nowe kroki weryfikacji konta wymagane przez aplikację, takie jak sprawdzenie, 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 version 9

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

    Web version 8

    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 utworzono nowe konto, użytkownik jest logowany automatycznie. Zajrzyj do poniższej sekcji Następne kroki, aby uzyskać dane zalogowanego użytkownika.

    Tutaj też możesz wyłapać i obsłużyć błędy. Listę kodów błędów znajdziesz w Auth Reference Docs .

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

Czynności dotyczące logowania użytkownika za pomocą hasła są podobne do czynności związanych z tworzeniem nowego konta. Na stronie logowania aplikacji wykonaj następujące czynności:

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

    Web version 9

    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 version 8

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

    Tutaj też możesz wyłapać i obsłużyć błędy. Listę kodów błędów znajdziesz w Auth Reference Docs .

Następne kroki

Gdy użytkownik zaloguje się po raz pierwszy, zostanie utworzone nowe konto użytkownika i połączone 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ęść projektu Firebase i może służyć do identyfikowania użytkownika w każdej aplikacji w projekcie, niezależnie od tego, jak się on loguje.

  • W aplikacjach zalecanym sposobem poznania stanu uwierzytelniania użytkownika jest ustawienie obserwatora na 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 czasu rzeczywistego i usługi Cloud Storage Firebase możesz uzyskać unikalny identyfikator zalogowanego użytkownika ze zmiennej auth i używać go do kontrolowania, do jakich danych użytkownik może uzyskać dostęp.

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

Aby wylogować użytkownika, zadzwoń do signOut :

Web version 9

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

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

Web version 8

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