Sign Up

Authentication

Hosted AuthKit

How your app, the SDK and the hosted sign-in pages fit together.

Two kinds of accounts#

  • 3een accounts belong to developers. They sign in at the 3een site to manage projects, environments and branding. This is the main-site sign-in, and it has its own pages, rules and users.
  • Your users belong to one environment of your project. They sign in on your hosted pages, at your environment's 3een subdomain or your custom domain, and each environment keeps its own users. The same email address can exist in several environments without them ever being linked.

The sign-in round trip#

  1. A SignInButton (or any link) sends the browser to your app's /api/auth/signin?redirect_uri=/where-they-were.
  2. handleAuth uses your API key to look up the environment's settings. With hosted pages enabled, it redirects to your hosted sign-in page with your client ID, a callback URL on your app and response_type=code. If they are turned off, it redirects to the sign-in page you configured instead.
  3. The user signs in with whatever the environment allows: password, social provider, magic code, passkey or SSO, with MFA if required.
  4. The hosted page redirects to /api/auth/callback?code=…. The SDK redeems the code on the server, sets httpOnly session cookies and sends the browser on to the original path.

One-time code handoff#

The code is single use, valid for 60 seconds, and bound to your environment and to the exact callback URL. The SDK redeems it at POST /authkit/token with your API key, so a code copied from a log or a Referer header is useless without that key.

Redirect URIs#

Register every callback URL in the environment's Redirects settings: https://app.example/api/auth/callback for Next.js, or your handleCallback route for Express, plus the localhost equivalents in development. The hosted pages refuse a redirect_uri that isn't registered. After sign-in, the SDK follows redirect_uri only as a path on your own origin; anything else falls back to your configured redirectUri.

Hosted screens#

Sign-in, sign-up, email verification, forgot password, password reset, MFA enrollment and challenge, magic code, passkeys, and the social and SSO handoffs. They follow your branding, work from 320-pixel phones up, follow the visitor's light or dark system theme when the branding allows it, and are translated into 16 languages.