Everything you need to know about Auth.io
Explore every screen, understand each flow, and learn how all the pieces connect — from creating your first realm to issuing tokens in production.
Platform architecture
How entities connect in Auth.io
Every screen explained
Click any entity below to explore its purpose, features, data model, and how it connects to the rest of the platform.
Realms
Multi-tenant isolation
A Realm is the top-level tenant boundary. It isolates users, clients, scopes, roles, keys, and all configurations. Everything starts with creating a realm.
Key features
Create separate realms for development, staging, and production environments to maintain complete isolation.
Connections
Fields
From zero to the first issued token
Follow the recommended implementation order. Click each step to see details and the corresponding API call.
Create your Realm
Define the main environment for your application. The realm establishes tenant isolation, naming, and organizational context.
Checklist
API example
{
"name": "My Application",
"realmId": "my-app",
"description": "Production environment"
}Four flows for every integration
Auth.io supports the most important OAuth2 and OIDC flows. Select a flow to understand each step and see a code example.
Authorization Code + PKCE
SPAs, mobile apps, and any public client that needs interactive login with maximum security.
Code example
// 1. Redirect to authorize
const params = new URLSearchParams({
response_type: 'code',
client_id: 'your-client-id',
redirect_uri: 'https://app.example.com/callback',
scope: 'openid profile email',
code_challenge: codeChallenge,
code_challenge_method: 'S256',
state: randomState,
})
window.location.href = `${authUrl}/authorize?${params}`
// 2. Exchange code for tokens
const tokens = await fetch(`${authUrl}/token`, {
method: 'POST',
headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
body: new URLSearchParams({
grant_type: 'authorization_code',
code: authorizationCode,
redirect_uri: 'https://app.example.com/callback',
client_id: 'your-client-id',
code_verifier: codeVerifier,
}),
})Ready-to-use code snippets
Copy and adapt these examples to integrate Auth.io into your application.
import NextAuth from 'next-auth'
export default NextAuth({
providers: [{
id: 'authio',
name: 'Auth.io',
type: 'oauth',
wellKnown: `${process.env.AUTHIO_URL}/realms/${realm}/.well-known/openid-configuration`,
clientId: process.env.AUTHIO_CLIENT_ID,
clientSecret: process.env.AUTHIO_CLIENT_SECRET,
authorization: { params: { scope: 'openid profile email' } },
idToken: true,
profile(profile) {
return {
id: profile.sub,
name: profile.name,
email: profile.email,
}
},
}],
callbacks: {
async jwt({ token, account }) {
if (account) {
token.accessToken = account.access_token
token.refreshToken = account.refresh_token
}
return token
},
},
})Beyond setup: governing the environment
Authentication is just the beginning. These areas require ongoing attention to maintain security and compliance.
Login branding
Customize the hosted login page: title, subtitle, colors, logo, background, and behavior per client.
Identity policies
Control password rules, username validation, lockout thresholds, email verification, and sender configuration.
Token & encryption
Configure JWS/JWE algorithms, token lifetimes, audience, key rotation, and signing strategies per client.
Observability
Monitor active sessions, consumer usage, client status, secret expiration, and security posture.
Common questions answered
Start building your authentication layer today
You now understand the full platform: realms, clients, users, consumers, roles, scopes, keys, and all authentication flows. Time to bring it to life.