Autenticar com Firebase usando contas baseadas em senha usando Javascript

Você pode usar o Firebase Authentication para permitir que seus usuários se autentiquem no Firebase usando endereços de e-mail e senhas e para gerenciar as contas baseadas em senha do seu aplicativo.

Antes de você começar

  1. Adicione o Firebase ao seu projeto JavaScript .
  2. Se você ainda não conectou seu aplicativo ao projeto do Firebase, faça isso no console do Firebase .
  3. Ative o login por e-mail/senha:
    1. No console do Firebase , abra a seção Auth .
    2. Na guia Método de login , ative o método de login por e-mail/senha e clique em Salvar .

Crie uma conta baseada em senha

Para criar uma nova conta de usuário com senha, siga estas etapas na página de inscrição do seu aplicativo:

  1. Quando um novo usuário se inscreve usando o formulário de inscrição do seu aplicativo, conclua todas as novas etapas de validação de conta exigidas pelo seu aplicativo, como verificar se a senha da nova conta foi digitada corretamente e atende aos seus requisitos de complexidade.
  2. Crie uma nova conta passando o endereço de e-mail e a senha do novo usuário para createUserWithEmailAndPassword :

    Web modular API

    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 namespaced API

    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 a nova conta tiver sido criada, o usuário será conectado automaticamente. Dê uma olhada na seção Próximas etapas abaixo para obter os detalhes do usuário conectado.

    É aqui também que você pode detectar e tratar erros. Para obter uma lista de códigos de erro, consulte os documentos de referência de autenticação .

Faça login em um usuário com um endereço de e-mail e senha

As etapas para fazer login de um usuário com senha são semelhantes às etapas para criar uma nova conta. Na página de login do seu aplicativo, faça o seguinte:

  1. Quando um usuário fizer login no seu aplicativo, passe o endereço de e-mail e a senha do usuário para signInWithEmailAndPassword :

    Web modular API

    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 namespaced API

    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
    Dê uma olhada na seção Próximas etapas abaixo para obter os detalhes do usuário conectado.

    É aqui também que você pode detectar e tratar erros. Para obter uma lista de códigos de erro, consulte os documentos de referência de autenticação .

Recomendado: ativar a proteção de enumeração de e-mail

Alguns métodos do Firebase Authentication que usam endereços de e-mail como parâmetros geram erros específicos se o endereço de e-mail não for registrado quando precisar ser registrado (por exemplo, ao fazer login com um endereço de e-mail e senha) ou registrado quando não precisar ser usado (por exemplo, ao alterar o endereço de e-mail de um usuário). Embora isso possa ser útil para sugerir soluções específicas aos usuários, também pode ser usado por agentes mal-intencionados para descobrir os endereços de e-mail registrados por seus usuários.

Para mitigar esse risco, recomendamos que você ative a proteção de enumeração de e-mail para seu projeto usando a ferramenta gcloud do Google Cloud. Observe que a ativação desse recurso altera o comportamento de relatório de erros do Firebase Authentication: certifique-se de que seu aplicativo não dependa de erros mais específicos.

Próximos passos

Depois que um usuário faz login pela primeira vez, uma nova conta de usuário é criada e vinculada às credenciais (ou seja, nome de usuário e senha, número de telefone ou informações do provedor de autenticação) com as quais o usuário fez login. Essa nova conta é armazenada como parte do seu projeto do Firebase e pode ser usada para identificar um usuário em todos os aplicativos do seu projeto, independentemente de como o usuário faz login.

  • Em seus aplicativos, a maneira recomendada de saber o status de autenticação do seu usuário é definir um observador no objeto Auth . Você pode então obter as informações básicas do perfil do usuário no objeto User . Consulte Gerenciar usuários .

  • Nas regras de segurança do Firebase Realtime Database e do Cloud Storage , você pode obter o ID de usuário exclusivo do usuário conectado na variável auth e usá-lo para controlar quais dados um usuário pode acessar.

Você pode permitir que os usuários façam login no seu aplicativo usando vários provedores de autenticação vinculando as credenciais do provedor de autenticação a uma conta de usuário existente.

Para desconectar um usuário, chame signOut :

Web modular API

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 namespaced API

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