Capítulo 2

Instalação do SDK (Frontend)

Para adicionar o One-Tap à sua aplicação, a primeira coisa a fazer é importar a nossa biblioteca JavaScript leve. Pode adicioná-la no <head> do seu HTML ou no final do <body>.

<script src="id.acapadev.com/js/acapadev-gsi.js"></script>

---

Inicialização do Prompt

Após carregar o SDK, deve inicializá-lo com o seu client_id (obtido no painel OAuth2) e com a referência da função (não o nome em string) que irá receber as credenciais JWT após o utilizador concluir o login.

window.onload = function () {
    acapadev.id.initialize({
        client_id: 'SEU_OAUTH_CLIENT_ID_AQUI',
        callback: handleAcapadevCredential // Referência direta à função, NÃO uma string
    });

    // Despoleta o render do popup One-Tap
    acapadev.id.prompt();
}

function handleAcapadevCredential(response) {
    // Aqui tem o seu Token JWT super seguro!
    console.log("Token JWT Recebido:", response.credential);

    // O próximo passo é enviar isto para o backend:
    enviarParaOBackend(response.credential);
}

Alternativa: Auto-init via atributos HTML

Se preferir não escrever JavaScript de inicialização, pode usar um <div> com atributos data-*. Neste caso, e só neste caso, o SDK resolve o nome da função a partir de window[data-callback] automaticamente assim que a página carrega:

<div id="acapadev-one-tap" data-client_id="SEU_OAUTH_CLIENT_ID_AQUI" data-callback="handleAcapadevCredential"></div>

<script>
function handleAcapadevCredential(response) {
    console.log("Token JWT Recebido:", response.credential);
}
</script>