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

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 projektu JavaScript .
  2. Jeśli nie zostały jeszcze podłączone swoją aplikację do projektu Firebase, zrobić z konsoli Firebase .
  3. Włącz logowanie przez e-mail/hasło:
    1. W konsoli Firebase otwórz sekcję Auth.
    2. Na karcie Logowanie w metodzie umożliwienia logowania metodą E-mail / hasło i kliknij przycisk 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 nowego użytkownika i hasło do createUserWithEmailAndPassword :

    Wersja internetowa 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;
        // ..
      });

    Wersja internetowa 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. Aby uzyskać listę kodów błędów mają zapoznać się z Autentycznymi Odniesienia 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 loguje się do aplikacji, należy przekazać adres e-mail użytkownika i hasło do signInWithEmailAndPassword :

    Wersja internetowa 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;
      });

    Wersja internetowa 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. Aby uzyskać listę kodów błędów mają zapoznać się z Autentycznymi Odniesienia 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 — przy użyciu 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 poznać stan swojego uwierzytelniania użytkownika jest ustawić obserwatora na Auth obiektu. Następnie można uzyskać podstawowe informacje o profilu użytkownika od User obiektu. Patrz Zarządzanie użytkownikami .

  • W bazie danych Firebase Realtime i Cloud Storage zasad bezpieczeństwa , można uzyskać podpisanego w unikalnym identyfikatorem użytkownika użytkownika z auth zmiennej i użyć go do kontroli, jakie dane dostępu może użytkownik.

Można zezwolić użytkownikom na logowanie się do aplikacji przy użyciu wielu dostawców uwierzytelniania przez łączenie auth poświadczenia dostawcy do istniejącego konta użytkownika.

Aby wylogować użytkownika, zadzwoń signOut :

Wersja internetowa 9

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

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

Wersja internetowa 8

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