Authentication Demo

OAuth Authentication

This component provides secure OAuth authentication with popular identity providers.

'Sign In to Your Account', 'subtitle' => 'Choose your preferred authentication method to continue', 'google_client_id' => 'YOUR_GOOGLE_CLIENT_ID', 'github_client_id' => 'YOUR_GITHUB_CLIENT_ID', 'discord_client_id' => 'YOUR_DISCORD_CLIENT_ID', 'twitch_client_id' => 'YOUR_TWITCH_CLIENT_ID', 'callback_url' => URL::Link('auth/callback'), 'debug' => true // Enable debug mode to see OAuth details ]) ?>

Setup Instructions

1. Create OAuth Applications

Create OAuth applications with your preferred providers:

For all providers, add callback URL:

2. Configure OAuth Component

Update the OAuth component with your client IDs from each provider:

views/account.php
<?php component('components/auth/oauth-client', [
    'google_client_id' => 'your-google-client-id',
    'github_client_id' => 'your-github-client-id',
    'discord_client_id' => 'your-discord-client-id',
    'twitch_client_id' => 'your-twitch-client-id',
    'callback_url' => URL::Link('auth/callback')
]); ?>

Note: Only providers with valid client IDs will appear as login options.

3. Implement Backend Handler

Create views/account/callback.php to handle the OAuth callback and exchange the authorization code for tokens:

views/account/callback.php
<?php
// Handle OAuth callback
if ($_GET['code']) {
    // Exchange code for access token
    // Get user profile from provider
    // Create/login user account
    // Set session and redirect
}
?>

Built-in Provider Support

The OAuth component comes with built-in support for popular providers:

Google OAuth

google.config
// Scope: openid, email, profile
// Additional params: access_type=offline
'google_client_id' => 'your-client-id'

GitHub OAuth

github.config
// Scope: user:email
// Additional params: allow_signup=true
'github_client_id' => 'your-client-id'

Discord OAuth

discord.config
// Scope: identify, email
// Additional params: prompt=consent
'discord_client_id' => 'your-client-id'

Twitch OAuth

twitch.config
// Scope: user:read:email
// Additional params: force_verify=true
'twitch_client_id' => 'your-client-id'

Current Session Status

✓ Logged In

User ID:

Email:

ⓘ Not Logged In

Use the OAuth component above to sign in with Google, GitHub, Discord, or Twitch.