Login e logout automáticos

Esta página descreve como implementar recursos relacionados à forma como os usuários fazem login ou saem com o Google One Tap.

Fazer login dos usuários automaticamente

O Google One Tap oferece suporte ao login automático, que proporciona uma experiência do usuário (UX) sem atrito ao remover as etapas manuais que os usuários precisam seguir ao retornar ao site. Os usuários não precisam se lembrar da Conta do Google selecionada na última visita, o que diminui as chances de criação de contas duplicadas desnecessárias na plataforma.

O login automático complementa nosso botão "Fazer login com o Google" e as caixas de diálogo de um toque. Ele foi projetado para ser usado em todo o site. A inscrição manual ou a troca de contas só ocorrem depois que o usuário sai do site.

Para que o login automático ocorra, as seguintes condições são necessárias:

  • os usuários precisam fazer login na Conta do Google e
  • consentiu anteriormente com o compartilhamento do perfil da conta com seu app;
  • ao usar o FedCM, fez apenas uma tentativa de login nos últimos 10 minutos. Um toque é exibido quando ocorrem tentativas repetidas de login durante essa janela.
  • ao usar o FedCM, o Chrome exige que os usuários confirmem novamente que querem fazer login no site com a Conta do Google em cada instância do Chrome, mesmo que tenham aprovado o site antes do lançamento da FedCM. Essa mudança pode afetar a taxa de conversão do seu site atual usando um toque. Na atualização do Chrome M121, a melhoria do login automático reduz o problema de queda na taxa de conversão.

Para páginas em que o login automático está ativado e se essas condições forem atendidas, a credencial do token de ID do usuário será retornada automaticamente sem nenhuma interação do usuário. Se essas condições não forem atendidas e mesmo que o login automático esteja ativado na página, o usuário usará o fluxo de um toque para fazer login ou consentimento por padrão. Se um usuário tiver várias Contas do Google e acessar seu site, ele precisará primeiro fazer login em uma única Conta do Google e fornecer consentimento para essa conta.

Você pode medir a taxa de sucesso de login automático usando o valor auto no campo select_by do objeto de credencial retornado.

Para ativar o login automático, adicione data-auto_select="true" ao seu código, conforme mostrado no snippet a seguir:

<div id="g_id_onload"
     data-client_id="YOUR_GOOGLE_CLIENT_ID"
     data-login_uri="https://your.domain/your_login_endpoint"
     data-auto_select="true">
</div>

Sair

Quando um usuário sai do seu site, ele pode ser direcionado para uma página em que uma solicitação de toque do Google One é exibida automaticamente. Nessa configuração, a seleção automática precisa ser proibida. Caso contrário, o usuário será conectado de novo automaticamente, o que leva a uma UX de loop morto.

Como usar o FedCM

Para melhorar a experiência do usuário, há um período de silêncio de 10 minutos entre cada tentativa de login automático. Durante esse período, a solicitação de um toque será exibida. Os usuários precisam clicar explicitamente em um toque para fazer login.

Sem FedCM

Para proibir a seleção automática depois que um usuário sair, adicione o nome da classe g_id_signout a todos os links e botões de logout. Confira o snippet de código abaixo:

<div class="g_id_signout">Sign Out</div>

O seguinte snippet de código JavaScript também pode ser usado para sair:

const button = document.getElementById('signout_button');
button.onclick = () => {
  google.accounts.id.disableAutoSelect();
}

Consequentemente, o status de logout é registrado por meio de um cookie no seu domínio para evitar a UX de loop morto.

O status de logout é armazenado no cookie g_state no seu domínio. Se você tem um serviço que monitora todos os cookies usados no seu domínio, é necessário notificá-los sobre esse cookie.

Se você não quiser carregar a biblioteca de cliente nas suas páginas pós-login, use estas soluções para evitar uma UX de loop morto após o logout:

  • Ao sair, redirecione os usuários para uma página (por exemplo, https://example.com/logged_out) em que um toque não é exibido ou em que o login automático está sempre desativado.
  • Ao sair, adicione um parâmetro ao URL. Por exemplo, logged_out=1. Ao renderizar a API One Tap by JavaScript, verifique esse parâmetro de URL e desative o login automático.

Principais jornadas do usuário

A página de login automático.

Como usar o FedCM

Pop-up de login automático do FedCM

Os usuários podem fechar a solicitação de um toque clicando no botão X. Para considerar a acessibilidade, um token de ID é compartilhado com seu site, mesmo que os usuários cliquem no botão X.

Para melhorar a experiência do usuário, há um período de silêncio de 10 minutos entre cada tentativa de login automático. Durante esse período, a solicitação de um toque será exibida. Os usuários precisam clicar explicitamente em um toque para fazer login.

Sem FedCM

Pop-up de login automático.

Se os usuários não clicarem no botão Cancelar em até cinco segundos, um token de ID será compartilhado com seu site.

Quando o login é cancelado, com base no número de sessões ativas do Google, a página do seletor de conta ou a página do usuário recorrente é exibida.

  • Várias sessões do Google

Página do Seletor de Conta

  • Sessões individuais do Google

Página do usuário que retorna com um toque