O Google tem o compromisso de promover a igualdade racial para as comunidades negras. Saiba como.

Primeiros passos com o Firebase Authentication em sites

Use o Firebase Authentication para permitir que os usuários façam login no seu app com um ou mais métodos de login, inclusive login com endereço de e-mail e senha, além de provedores de identidade federados como o Login do Google e do Facebook. Veja neste tutorial os primeiros passos com o Firebase Authentication e como adicionar no seu app um login com endereço de e-mail e senha.

Conectar seu app ao Firebase

Instale o SDK do Firebase. Cole o código de configuração na sua página da Web, conforme descrito.

Criar protótipos e fazer testes com o Pacote do emulador local do Firebase (opcional)

Antes de ver informações sobre como seu app autentica os usuários, confira o Pacote do emulador local do Firebase, um conjunto de ferramentas que podem ser usadas para criar protótipos e testar a funcionalidade do Authentication. Conseguir trabalhar localmente sem precisar implantar serviços existentes será uma ótima ideia se você estiver decidindo entre técnicas e provedores de autenticação, testando modelos de dados diferentes com dados públicos e particulares usando as regras de segurança do Firebase e do Authentication ou criando protótipos de designs de IU de login.

Um emulador do Authentication faz parte do Pacote do emulador local, que permite ao seu app interagir com o conteúdo e a configuração do banco de dados emulado. Além disso, ele também permite interagir com os recursos do projeto emulado (opcional), como funções, outros bancos de dados e regras de segurança. O Pacote do emulador local ainda não é compatível com o Cloud Storage emulado.

O uso do emulador do Authentication envolve apenas alguns passos:

  1. Para se conectar ao emulador, adicione uma linha de código à configuração de teste do app.
  2. Execute firebase emulators:start na raiz do diretório do projeto local.
  3. Use a IU do Pacote do emulador local para fazer uma prototipagem interativa ou use a API REST do emulador do Authentication para fazer testes não interativos.

Veja um guia detalhado em Conecte seu aplicativo ao emulador de autenticação. Para mais informações, consulte Introdução ao conjunto de emuladores locais do Firebase.

Agora veremos como autenticar os usuários.

Login de novos usuários

Crie um formulário que permita que novos usuários se inscrevam no seu app usando endereço de e-mail e senha. Quando um usuário preencher o formulário, valide o endereço de e-mail e a senha informados por ele e envie-os para o método createUserWithEmailAndPassword:

firebase.auth().createUserWithEmailAndPassword(email, password)
  .then((userCredential) => {
    // Signed in
    var user = userCredential.user;
    // ...
  })
  .catch((error) => {
    var errorCode = error.code;
    var errorMessage = error.message;
    // ..
  });

Login de usuários existentes

Crie um formulário que permita que usuários existentes façam login com um endereço de e-mail e senha. Quando um usuário preencher o formulário, chame o método signInWithEmailAndPassword:

firebase.auth().signInWithEmailAndPassword(email, password)
  .then((userCredential) => {
    // Signed in
    var user = userCredential.user;
    // ...
  })
  .catch((error) => {
    var errorCode = error.code;
    var errorMessage = error.message;
  });

Definir um observador do estado de autenticação e coletar dados do usuário

Para cada página do seu app que precisa de informações sobre o usuário conectado, anexe um observador ao objeto de autenticação global. Este observador é chamado sempre que o estado de login do usuário muda.

Anexe o observador usando o método onAuthStateChanged. Quando um usuário faz login corretamente, você pode coletar informações sobre o usuário no observador.

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

Próximas etapas

Saiba como adicionar suporte para outros provedores de identidade e contas de convidados anônimos: