Como mostrar um domínio personalizado durante o login

Neste documento, mostramos como personalizar o gerenciador de autenticação do Identity Platform para que os usuários vejam seu domínio ao fazer login.

Noções básicas sobre o gerenciador de autenticação padrão

Quando você ativa o Identity Platform para seu projeto, um subdomínio exclusivo com tecnologia do Firebase Hosting é criado automaticamente. O domínio tem o formato https://[PROJECT-ID].firebaseapp.com. Por padrão, o Identity Platform usa esse domínio para lidar com todos os redirecionamentos de login do OAuth, OIDC e SAML.

O uso do domínio padrão tem vários benefícios:

  • Usar vários domínios com os mesmos provedores federados

  • Compartilhar um único URL de callback em diferentes serviços e domínios

  • Funciona com provedores compatíveis com apenas um URL de callback por app.

A desvantagem do gerenciador padrão é que os usuários verão brevemente o URL https://[PROJECT-ID].firebaseapp.com ao fazer login.

Personalizar o gerenciador de autenticação

Para substituir o gerenciador padrão pelo seu gerenciador personalizado, faça o seguinte:

  1. No console do Firebase, conecte seu projeto a um domínio personalizado.

  2. No console Google Cloud , acesse a página Identity Platform > Provedores de identidade.
    Acessar "Provedores de identidade"

  3. Selecione seu provedor de identidade.

  4. No painel lateral Configurações do projeto, clique em Adicionar domínio e adicione seu domínio personalizado.

  5. Clique em Salvar.

  6. Na configuração do app, atualize o URL de callback com seu domínio personalizado em vez do domínio padrão. Por exemplo, mude https://myproject.firebaseapp.com/__/auth/handler para https://auth.mycustomdomain.com/__/auth/handler.

Atualizar a configuração do SDK do cliente

Web

É possível copiar o código de inicialização do SDK do cliente no consoleGoogle Cloud . Se você personalizar o gerenciador de autenticação, será necessário atualizar o campo authDomain para seu domínio personalizado:

Versão 9 para a Web

import { initializeApp } from "firebase/app";

const firebaseConfig = {
  apiKey: "...",
  // By default, authDomain is '[YOUR_APP].firebaseapp.com'.
  // You may replace it with a custom domain.
  authDomain: '[YOUR_CUSTOM_DOMAIN]'
};
const firebaseApp = initializeApp(firebaseConfig);

Versão 8 para a Web

firebase.initializeApp({
  apiKey: '...',
  // By default, authDomain is '[YOUR_APP].firebaseapp.com'.
  // You may replace it with a custom domain.
  authDomain: '[YOUR_CUSTOM_DOMAIN]'
});

Android e iOS

Para personalizar o manipulador de autenticação, use o seguinte código:

Java

FirebaseAuth.getInstance().setCustomAuthDomain("[YOUR_CUSTOM_DOMAIN]");

Kotlin+KTX

Firebase.auth.setCustomAuthDomain("[YOUR_CUSTOM_DOMAIN]")

Swift

let auth = Auth.auth()
auth.customAuthDomain = "[YOUR_CUSTOM_DOMAIN]"

Objective-C

FIRAuth *auth = [FIRAuth auth];
auth.customAuthDomain("[YOUR_CUSTOM_DOMAIN]");