Eseguire l'autenticazione con Firebase utilizzando account basati su password con JavaScript

Puoi utilizzare Firebase Authentication per consentire agli utenti di autenticarsi su Firebase utilizzando i loro indirizzi email e le loro password e per gestire gli account basati su password della tua app.

Prima di iniziare

  1. Aggiungi Firebase al tuo progetto JavaScript.
  2. Se non hai ancora collegato la tua app al progetto Firebase, puoi farlo dalla console Firebase.
  3. Abilita l'accesso con email/password:
    1. Nella console Firebase, apri la sezione Autorizzazione.
    2. Nella scheda Metodo di accesso, attiva il metodo di accesso Email/password e fai clic su Salva.

Creare un account basato su password

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

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

    Web

    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;
    // ..
  });
    auth_signup_password.js

    Web

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

    Qui puoi anche rilevare e gestire gli errori. Per un elenco dei codici di errore, consulta la documentazione di riferimento per le autorizzazioni.

Accedere a un utente con un indirizzo email e una password

I passaggi per far accedere un utente con una password sono simili a quelli per creare un nuovo account. Nella pagina di accesso dell'app, procedi nel seguente modo:

  1. Quando un utente accede alla tua app, trasmetti l'indirizzo email e la password dell'utente a signInWithEmailAndPassword:

    Web

    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;
  });
    auth_signin_password.js

    Web

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

    Qui puoi anche rilevare e gestire gli errori. Per un elenco dei codici di errore, consulta la documentazione di riferimento per le autorizzazioni.

(Consigliato) Imposta un criterio per le password

Puoi migliorare la sicurezza degli account applicando i requisiti di complessità delle password.

Per configurare un criterio per le password per il tuo progetto, apri la scheda Criterio per le password nella pagina Impostazioni di autenticazione della console Firebase:

Impostazioni di autenticazione

I criteri per le password di Firebase Authentication supportano i seguenti requisiti per le password:

  • È necessario un carattere minuscolo

  • È necessario un carattere maiuscolo

  • Carattere numerico obbligatorio

  • È necessario un carattere non alfanumerico

    I seguenti caratteri soddisfano il requisito di caratteri non alfanumerici: ^ $ * . [ ] { } ( ) ? " ! @ # % & / \ , > < ' : ; | _ ~

  • Lunghezza minima della password (da 6 a 30 caratteri; il valore predefinito è 6)

  • Lunghezza massima della password (lunghezza massima di 4096 caratteri)

Puoi abilitare l'applicazione dei criteri relativi alle password in due modalità:

  • Richiedi: i tentativi di registrazione non vanno a buon fine finché l'utente non aggiorna una password conforme ai tuoi criteri.

  • Invia una notifica: gli utenti possono registrarsi con una password non conforme. Quando utilizzi questa modalità, devi verificare se la password dell'utente è conforme ai criteri lato client e chiedere all'utente in qualche modo di aggiornare la password se non è conforme.

I nuovi utenti sono sempre tenuti a scegliere una password conforme alle tue norme.

Se hai utenti attivi, ti consigliamo di non attivare l'upgrade forzato al momento dell'accesso se non intendi bloccare l'accesso agli utenti le cui password non sono conformi ai tuoi criteri. Utilizza invece la modalità di notifica, che consente agli utenti di accedere con le loro password attuali e di informarli dei requisiti mancanti per la password.

Convalida di una password sul client in corso...

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

const status = await validatePassword(getAuth(), passwordFromUser);
if (!status.isValid) {
  // Password could not be validated. Use the status to show what
  // requirements are met and which are missing.

  // If a criterion is undefined, it is not required by policy. If the
  // criterion is defined but false, it is required but not fulfilled by
  // the given password. For example:
  const needsLowerCase = status.containsLowercaseLetter !== true;
}

(Consigliato) Attiva la protezione da enumerazione email

Alcuni metodi Firebase Authentication che accettano indirizzi email come parametri generano errori specifici se l'indirizzo email non è registrato quando deve esserlo (ad esempio, quando accedi con un indirizzo email e una password) o se è registrato quando deve essere inutilizzato (ad esempio, quando modifichi l'indirizzo email di un utente). Questo può essere utile per suggerire rimedi specifici agli utenti, ma può anche essere utilizzato in modo illecito da malintenzionati per scoprire gli indirizzi email registrati dagli utenti.

Per ridurre questo rischio, ti consigliamo di attivare la protezione per l'enumerazione delle email per il tuo progetto utilizzando lo strumento gcloud di Google Cloud. Tieni presente che l'attivazione di questa funzionalità modifica il comportamento di generazione di report sugli errori di Firebase Authentication: assicurati che la tua app non si basi sugli errori più specifici.

Passaggi successivi

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

  • Nelle tue app, il modo consigliato per conoscere lo stato di autenticazione dell'utente è impostare un osservatore sull'oggetto Auth. Puoi quindi ottenere le informazioni di base del profilo dell'utente dall'oggetto User. Vedi Gestire gli utenti.

  • Nelle regole di sicurezza di Firebase Realtime Database e Cloud Storage, puoi recuperare l'ID utente univoco dell'utente che ha eseguito l'accesso dalla variabile auth e utilizzarlo per controllare i dati a cui può accedere.

Puoi consentire agli utenti di accedere alla tua app utilizzando più provider di autenticazione collegando le credenziali del provider di autenticazione a un account utente esistente.

Per disconnettere un utente, chiama signOut:

Web

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

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

Web

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