Autenticazione con Firebase utilizzando account basati su password utilizzando Javascript

Puoi utilizzare l'autenticazione Firebase per consentire ai tuoi utenti di autenticarsi con Firebase utilizzando i loro indirizzi e-mail e password e per gestire gli account basati su password della tua app.

Prima di iniziare

  1. Aggiungere Firebase al progetto JavaScript .
  2. Se non hai ancora collegato l'app per il vostro progetto Firebase, farlo dalla console Firebase .
  3. Abilita accesso email/password:
    1. Nella console Firebase , aprire la sezione Auth.
    2. Sul segno nella scheda Metodo, abilitare l'accesso in modalità E-mail / password e fare clic su Salva.

Crea un account basato su password

Per creare un nuovo account utente con una password, completa i seguenti passaggi nella pagina di registrazione della tua app:

  1. Quando un nuovo utente si registra utilizzando il modulo di registrazione della tua app, completa tutti i nuovi passaggi di convalida dell'account richiesti dalla tua app, ad esempio verificando che la password del nuovo account sia stata digitata correttamente e soddisfi i requisiti di complessità.
  2. Creare un nuovo account passando l'indirizzo email e la password del nuovo utente a createUserWithEmailAndPassword :

    Versione web 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;
        // ..
      });

    Versione web 8

    firebase.auth().createUserWithEmailAndPassword(email, password)
      .then((userCredential) => {
        // Signed in 
        var user = userCredential.user;
        // ...
      })
      .catch((error) => {
        var errorCode = error.code;
        var errorMessage = error.message;
        // ..
      });
    Se il nuovo account è stato creato, l'utente accede automaticamente. Dai un'occhiata alla sezione Passaggi successivi di seguito per ottenere i dettagli dell'utente che ha effettuato l'accesso.

    Qui è anche possibile rilevare e gestire gli errori. Per un elenco dei codici di errore hanno uno sguardo ai Auth riferimento Docs .

Accedi come utente con un indirizzo email e una password

I passaggi per l'accesso di un utente con una password sono simili ai passaggi per la creazione di un nuovo account. Nella pagina di accesso della tua app, procedi come segue:

  1. Quando un utente accede per la vostra applicazione, passano indirizzo email e la password dell'utente per signInWithEmailAndPassword :

    Versione web 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;
      });

    Versione web 8

    firebase.auth().signInWithEmailAndPassword(email, password)
      .then((userCredential) => {
        // Signed in
        var user = userCredential.user;
        // ...
      })
      .catch((error) => {
        var errorCode = error.code;
        var errorMessage = error.message;
      });
    Dai un'occhiata alla sezione Passaggi successivi di seguito per ottenere i dettagli dell'utente che ha effettuato l'accesso.

    Qui è anche possibile rilevare e gestire gli errori. Per un elenco dei codici di errore hanno uno sguardo ai Auth riferimento Docs .

Prossimi passi

Dopo che un utente accede per la prima volta, viene creato un nuovo account utente e collegato alle credenziali, ovvero nome utente e password, numero di telefono o informazioni sul provider di autenticazione, con cui l'utente ha effettuato l'accesso. Questo nuovo account viene archiviato come parte del tuo progetto Firebase e può essere utilizzato per identificare un utente in ogni app del progetto, indipendentemente da come l'utente accede.

  • Nelle vostre applicazioni, il metodo consigliato per conoscere lo stato di autenticazione del vostro utente è quello di impostare un osservatore sulla Auth oggetto. È quindi possibile ottenere informazioni sul profilo di base dell'utente dal User oggetto. Vedere Gestione utenti .

  • Nel database Firebase in tempo reale e cloud storage Regole di sicurezza , è possibile ottenere la firma-in ID utente univoco dell'utente dal auth variabile e utilizzarlo per controllare quali dati un accesso utente può.

È possibile consentire agli utenti di accedere alla vostra applicazione utilizzando più provider di autenticazione da collegando Auth credenziali di provider per un account utente esistente.

Per firmare un utente, chiamata signOut :

Versione web 9

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

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

Versione web 8

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