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

Puoi utilizzare Firebase Authentication per consentire agli utenti di eseguire l'autenticazione con Firebase utilizzando i propri indirizzi email e 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 connesso la tua app al progetto Firebase, fallo dalla console Firebase.
3. Attiva l'accesso con email/password:
   1. Nella Firebaseconsole, apri la sezione Auth.
   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 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 la verifica che la password del nuovo account sia stata digitata correttamente e soddisfi i 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 esegue automaticamente l'accesso. Consulta la sezione Passaggi successivi di seguito per visualizzare i dettagli dell'utente che ha eseguito l'accesso.

   È anche qui che puoi rilevare e gestire gli errori. Per un elenco dei codici di errore, consulta la documentazione di riferimento sull'autenticazione.

Per proteggere il tuo progetto da comportamenti illeciti, Firebase limita il numero di nuove registrazioni anonime e tramite email/password che la tua applicazione può ricevere dallo stesso indirizzo IP in un breve periodo di tempo. Puoi richiedere e pianificare modifiche temporanee a questa quota dalla console Firebase.

Accedere come utente con un indirizzo email e una password

I passaggi per accedere con una password sono simili a quelli per creare un nuovo account. Nella pagina di accesso dell'app:

1. Quando un utente accede alla tua app, trasmetti il suo indirizzo email e la sua password 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 visualizzare i dettagli dell'utente che ha eseguito l'accesso.

   È anche qui che puoi rilevare e gestire gli errori. Per un elenco dei codici di errore, consulta la documentazione di riferimento sull'autenticazione.

Consigliato: imposta un criterio per le password

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

Per configurare una norma relativa alle password per il tuo progetto, apri la scheda Norma relativa alle 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:

• È richiesto un carattere minuscolo

• È richiesto un carattere maiuscolo

• È necessario un carattere numerico

• È richiesto un carattere non alfanumerico

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

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

• Lunghezza massima della password (massimo 4096 caratteri)

Puoi attivare l'applicazione forzata 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 criteri.

• Notifica: gli utenti possono registrarsi con una password non conforme. Quando utilizzi questa modalità, devi verificare se la password dell'utente è conforme alle norme lato client e chiedere all'utente 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 all'accesso a meno che tu non intenda bloccare l'accesso agli utenti le cui password non rispettano i tuoi criteri. Utilizza invece la modalità di notifica, che consente agli utenti di accedere con le password attuali e li informa dei requisiti mancanti della password.

Convalida di una password sul client

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 si accede con un indirizzo email e una password) o registrato quando deve essere inutilizzato (ad esempio, quando si modifica l'indirizzo email di un utente). Sebbene possa essere utile per suggerire rimedi specifici agli utenti, può anche essere utilizzato in modo illecito da malintenzionati per scoprire gli indirizzi email registrati dai tuoi utenti.

Per ridurre questo rischio, ti consigliamo di attivare la protezione dall'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 segnalazione degli 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, ovvero nome utente e password, numero di telefono o informazioni del fornitore di autenticazione, con cui l'utente ha eseguito l'accesso. Questo nuovo account viene memorizzato come parte del tuo progetto Firebase e può essere utilizzato per identificare un utente in ogni app del tuo progetto, indipendentemente dalla modalità di accesso.

• Nelle tue app, il modo consigliato per conoscere lo stato di autenticazione dell'utente è impostare un observer 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 ottenere l'ID utente univoco dell'utente che ha eseguito l'accesso dalla variabile auth e utilizzarlo per controllare a quali dati può accedere un utente.

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