Vanilla JS

Hosted

<script src="https://tapok.orria.space/tapok.js"></script>
<button id="login">Войти</button>
<script>
  document.querySelector('#login').onclick = async () => {
    try {
      const result = await window.Tapok.login()
      await sendTokenToBackend(result.token)
    } catch (error) {
      console.error(error.code)
    }
  }
</script>

Popup открывайте непосредственно из click handler. Backend проверяет token через verifyHostedToken(token, { origin }). Hosted возвращает pairwise UID и nullable 18+, но не профиль, контакты или исходный ID провайдера.

Connect

import { createTapokConnect } from '@orria/tapok/browser'

const tapok = createTapokConnect({
  clientId: 'tapok_…',
  redirectUri: location.origin + '/auth/callback',
  scopes: ['session', 'profile:display_name'],
})

document.querySelector('#login').onclick = () => tapok.startSignIn()
if (location.pathname === '/auth/callback') {
  const callback = tapok.finishSignIn()
  if (callback) sendToOwnBackend(callback)
}

Backend выполняет Connect exchange через exchangeConnectCode() с API key. Никогда не добавляйте API key в script.

Подробнее: Tapok Hosted и Hosted/Connect.