Autenticar com o Firebase usando contas baseadas em senha usando JavaScript

Use Firebase Authentication para permitir que os usuários se autentiquem com o Firebase usando os próprios endereços de e-mail e senhas e para gerenciar as contas baseadas em senha do seu app.

Antes de começar

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

Criar uma conta baseada em senha

Para criar uma nova conta de usuário com uma senha, execute as seguintes etapas na página de login do app:

Quando um novo usuário se inscrever usando o formulário do seu app, conclua as etapas de validação da nova conta exigidas pelo app, como verificar se a senha da nova conta foi digitada corretamente e atende aos requisitos de complexidade.

Crie uma conta enviando o endereço de e-mail e a senha do novo usuário para 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 a nova conta for criada, o usuário será conectado automaticamente. Confira a seção "Próximas etapas" abaixo para receber os detalhes do usuário conectado.

Também é nesse local que você poderá identificar e solucionar erros. Para uma lista de códigos de erro, veja a Documentação de referência sobre autenticação.

Conectar um usuário com endereço de e-mail e senha

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

Quando um usuário fizer login no app, transmita o endereço de e-mail e a senha dele para 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

Confira a seção "Próximas etapas" abaixo para receber os detalhes do usuário conectado.

Também é nesse local que você poderá identificar e solucionar erros. Para ver uma lista de códigos de erro, consulte os Documentos de referência de autenticação.

Recomendado: definir uma política de senha

É possível melhorar a segurança da conta aplicando requisitos de complexidade de senha.

Para configurar uma política de senha para seu projeto, abra a guia Política de senha na página "Configurações de autenticação" do console do Firebase:

Configurações de autenticação

As políticas de senha Firebase Authentication são compatíveis com os seguintes requisitos de senha:

É necessário usar letras minúsculas
Caractere maiúsculo obrigatório
Caractere numérico obrigatório
É necessário um caractere não alfanumérico

Os caracteres a seguir atendem ao requisito de caracteres não alfanuméricos: ^ $ * . [ ] { } ( ) ? " ! @ # % & / \ , > < ' : ; | _ ~
Tamanho mínimo da senha (variando de 6 a 30 caracteres; o padrão é 6)
Tamanho máximo da senha (4.096 caracteres)

É possível ativar a aplicação da política de senha em dois modos:

Exigir: não será possível se inscrever até que o usuário atualize a senha de acordo com sua política.
Notificar: os usuários podem se inscrever com uma senha que não está em conformidade com sua política. Ao usar esse modo, verifique se a senha do usuário está em conformidade com a política no lado do cliente e solicite que o usuário atualize a senha se ela não estiver em compliance.

Os novos usuários sempre precisam escolher uma senha que esteja em conformidade com sua política.

Se você tiver usuários ativos, recomendamos não ativar o upgrade forçado no login, a menos que tenha a intenção de bloquear o acesso de usuários com senhas que não obedecem à sua política. Em vez disso, use o modo de notificação, que permite que os usuários façam login com as senhas atuais e informa os requisitos que faltam na senha.

Como validar uma senha no cliente

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;
}

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

Alguns métodos Firebase Authentication que usam endereços de e-mail como parâmetros vão gerar erros específicos se o endereço de e-mail não estiver registrado quando deveria estar (por exemplo, ao fazer login com um endereço de e-mail e uma senha) ou estiver registrado quando não deveria ser usado (por exemplo, ao alterar o endereço de e-mail de um usuário). Embora esses métodos sejam úteis para sugerir soluções específicas aos usuários, eles também podem ser usados indevidamente por agentes mal-intencionados para descobrir os endereços de e-mail registrados.

Para mitigar esse risco, recomendamos ativar a proteção contra enumeração de e-mails no seu projeto usando a ferramenta gcloud do Google Cloud. Como a ativação desse recurso muda o comportamento dos relatórios de erro do Firebase Authentication, verifique se o app não se baseia em erros mais específicos.

Próximas etapas

Depois que um usuário faz login pela primeira vez, uma nova conta de usuário é criada e vinculada às credenciais, que podem ser o número do telefone, o nome de usuário e a senha ou as informações do provedor de autenticação. Essa nova conta é armazenada como parte do projeto do Firebase e pode ser usada para identificar um usuário em todos os apps do projeto, seja qual for o método de login utilizado.

Nos apps, a maneira recomendada de saber o status de autenticação do seu usuário é definindo um observador no objeto Auth. É possível, então, receber as informações básicas de perfil do usuário do objeto User. Consulte Gerenciar usuários.
Nas Regras de segurança Firebase Realtime Database e Cloud Storage, você pode acessar o ID exclusivo do usuário conectado pela variável auth e usar essas informações para controlar quais dados um usuário pode acessar.

Os usuários podem fazer login no app usando vários provedores de autenticação. Basta vincular as credenciais desses provedores a uma conta de usuário.

Para desconectar um usuário, chame 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