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:

  • Configuração mais fácil

  • 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.

Como personalizar o gerenciador de autenticação

Para modificar o gerenciador padrão e fornecer seu próprio:

  1. Conecte seu projeto a um domínio personalizado. Você precisará concluir estas etapas usando o Console do Firebase. Não é possível usar a Google Cloud CLI ou o console do Google Cloud.

  2. Acesse a página Provedores de identidade no console do Google Cloud e selecione seu provedor SAML. Acessar a página "Provedores do Identity Platform"

  3. Adicione o domínio personalizado à lista de Domínios autorizados.

  4. Atualize o URL de callback com o provedor de identidade para usar o domínio personalizado em vez do domínio padrão. Por exemplo, altere https://myproject.firebaseapp.com/__/auth/handler para https://auth.mycustomdomain.com/__/auth/handler.

  5. Clique em Salvar.

Como atualizar a configuração do SDK do cliente

Web

Normalmente, você pode copiar o código de inicialização do SDK do cliente no Console do Google 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);
auth_init_custom_domain.js

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]'
});
index.js

Android e iOS

Para personalizar o gerenciador 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]");