Autentica con Firebase in modo anonimo utilizzando JavaScript

Puoi utilizzare l'autenticazione Firebase per creare e utilizzare account anonimi temporanei per l'autenticazione con Firebase. Questi account anonimi temporanei possono essere utilizzati per consentire agli utenti che non si sono ancora registrati alla tua app di lavorare con dati protetti da regole di sicurezza. Se un utente anonimo decide di iscriversi alla tua applicazione, è possibile collegare il loro credenziali di accesso per l'account anonimo in modo che possano continuare a lavorare con i propri dati protetti in sessioni future.

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 autenticazione anonima:
    1. Nella console Firebase , aprire la sezione Auth.
    2. Nella pagina Sign-in Metodi, abilitare l'accesso in modo anonimo.

Autentica con Firebase in modo anonimo

Quando un utente disconnesso utilizza una funzionalità dell'app che richiede l'autenticazione con Firebase, accedi all'utente in modo anonimo completando i seguenti passaggi:

  1. Chiamare il signInAnonymously metodo:

    Versione web 9

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

    Versione web 8

    firebase.auth().signInAnonymously()
      .then(() => {
        // Signed in..
      })
      .catch((error) => {
        var errorCode = error.code;
        var errorMessage = error.message;
        // ...
      });
    Qui è anche possibile rilevare e gestire gli errori. Per un elenco dei codici di errore hanno uno sguardo ai Auth riferimento Docs .
  2. Se i signInAnonymously metodo completato senza errori, l'osservatore registrato nella onAuthStateChanged attiverà e si può ottenere dati dell'account dell'utente anonimo dalla User oggetto:

    Versione web 9

    import { getAuth, onAuthStateChanged } from "firebase/auth";
    
    const auth = getAuth();
    onAuthStateChanged(auth, (user) => {
      if (user) {
        // User is signed in, see docs for a list of available properties
        // https://firebase.google.com/docs/reference/js/firebase.User
        const uid = user.uid;
        // ...
      } else {
        // User is signed out
        // ...
      }
    });

    Versione web 8

    firebase.auth().onAuthStateChanged((user) => {
      if (user) {
        // User is signed in, see docs for a list of available properties
        // https://firebase.google.com/docs/reference/js/firebase.User
        var uid = user.uid;
        // ...
      } else {
        // User is signed out
        // ...
      }
    });

Converti un account anonimo in un account permanente

Quando un utente anonimo si iscrive alla tua app, potresti voler consentire loro di continuare a lavorare con il suo nuovo account, ad esempio, potresti voler rendere disponibili gli articoli che l'utente ha aggiunto al carrello prima della registrazione nel nuovo carrello acquisti dell'account. Per fare ciò, completare i seguenti passaggi:

  1. Quando l'utente si iscrive, completano il segno-in flusso per provider di autenticazione dell'utente fino a, ma non inclusi, chiamando uno dei Auth.signInWith metodi. Ad esempio, ottieni il token ID Google dell'utente, il token di accesso a Facebook o l'indirizzo e-mail e la password.
  2. Ottenere un AuthCredential per il nuovo provider di autenticazione:

    Accesso a Google

    Versione web 9

    import { GoogleAuthProvider } from "firebase/auth";
    
    const credential = GoogleAuthProvider.credential(
      googleUser.getAuthResponse().id_token);

    Versione web 8

    var credential = firebase.auth.GoogleAuthProvider.credential(
      googleUser.getAuthResponse().id_token);
    Accesso a Facebook

    Versione web 9

    import { FacebookAuthProvider } from "firebase/auth";
    
    const credential = FacebookAuthProvider.credential(
      response.authResponse.accessToken);

    Versione web 8

    var credential = firebase.auth.FacebookAuthProvider.credential(
      response.authResponse.accessToken);
    Accesso con password e-mail

    Versione web 9

    import { EmailAuthProvider } from "firebase/auth";
    
    const credential = EmailAuthProvider.credential(email, password);

    Versione web 8

    var credential = firebase.auth.EmailAuthProvider.credential(email, password);
  3. Passare l' AuthCredential oggetto al di accesso dell'utente link metodo:

    Versione web 9

    import { getAuth, linkWithCredential } from "firebase/auth";
    
    const auth = getAuth();
    linkWithCredential(auth.currentUser, credential)
      .then((usercred) => {
        const user = usercred.user;
        console.log("Anonymous account successfully upgraded", user);
      }).catch((error) => {
        console.log("Error upgrading anonymous account", error);
      });

    Versione web 8

    auth.currentUser.linkWithCredential(credential)
      .then((usercred) => {
        var user = usercred.user;
        console.log("Anonymous account successfully upgraded", user);
      }).catch((error) => {
        console.log("Error upgrading anonymous account", error);
      });

Se la chiamata a link riesce, il nuovo account dell'utente può accedere ai dati Firebase dell'account anonimo.

Prossimi passi

Ora che gli utenti possono autenticare con Firebase, è possibile controllare l'accesso ai dati nel database Firebase utilizzando regole Firebase .