OIDC Provider Integration
Use Upod as an OIDC provider for federated login
If you already have an authentication system and want to use Upod as an OIDC provider for federated login, this is the simplest integration path. In many cases, you may not even need our client library - you can use any standard OIDC client library.
When to Use This
- You have an existing authentication system
- You want to offer Upod as a federated login option
- You're comfortable working with OIDC/OAuth2 protocols
- You want minimal dependencies
Prerequisites
Before starting, you need to:
- Register as a new OIDC client - You must register your application as a new OIDC client by contacting us via email. We'll register your
client_idandredirect_uri(s)for you. - Choose an OIDC client library for your technology stack (or use our client library)
Using Our Client Library
If you prefer to use our client library for OIDC integration:
<script src="https://cdn.upod.eu/client/bundle.browser.js"></script>
<script>
const client = upod.initialize({
authority: 'https://account.upod.eu',
client_id: 'your-client-id', // Obtained by contacting us
redirect_uri: location.origin + location.pathname,
post_logout_redirect_uri: location.origin + location.pathname,
});
// Handle OIDC callback
client.handleCallbackIfNeeded().then(() => {
client.isAuthenticated().then(loggedIn => {
if (loggedIn) {
// User is authenticated, fetch profile data
client
.fetch({ path: '/storage/profile', method: 'get' })
.then(profile => {
console.log('User profile:', profile);
// Integrate with your existing auth system
});
}
});
});
// Listen for login events
client.onLogin(user => {
console.log('User logged in:', user);
// Update your auth system, fetch profile, etc.
});
// Listen for logout events
client.onLogout(() => {
console.log('User logged out');
// Update your auth system, clear session, etc.
});
// Trigger login
function loginWithUpod() {
client.login();
}
</script>Using Standard OIDC Libraries
You can also use any standard OIDC client library. Upod supports:
- OIDC Discovery:
https://account.upod.eu/.well-known/openid-configuration - Authorization Code Flow with PKCE (recommended)
- Standard OIDC endpoints
Example with oidc-client-ts (TypeScript/JavaScript)
import { UserManager } from 'oidc-client-ts';
const userManager = new UserManager({
authority: 'https://account.upod.eu',
client_id: 'your-client-id', // Obtained by contacting us
redirect_uri: window.location.origin + window.location.pathname,
post_logout_redirect_uri: window.location.origin + window.location.pathname,
response_type: 'code',
scope: 'openid profile',
});
// Sign in
await userManager.signinRedirect();
// Handle callback
await userManager.signinRedirectCallback();
// Get user
const user = await userManager.getUser();Getting User Profile Data
After successful authentication, you can fetch anonymized user profile data:
// Using our client library
const profile = await client.fetch({
path: '/storage/profile',
method: 'get',
});
// Profile contains:
// {
// gender: 'male' | 'female' | 'other',
// ageRange: [min, max] | [min, null],
// residence: 'City Name'
// }Integration Steps
- Contact us via email to register your application as a new OIDC client. We'll register your
client_idandredirect_uri(s), and you'll receive yourclient_id - Choose your integration method:
- Use our client library (simpler, includes helper methods)
- Use a standard OIDC library (more control, works with existing auth systems)
- Implement the login flow in your application
- Handle the OIDC callback after user authentication
- Fetch user profile data using the authenticated session
- Integrate profile data into your existing user management system
Benefits
- ✅ Minimal integration required
- ✅ Works with existing authentication systems
- ✅ Standard OIDC protocol support
- ✅ Can use any OIDC-compatible library
- ✅ No widget or UI components required
Next Steps
- See our live examples for a working implementation
- Contact us to register your OIDC client
- Review the anonymized profile data documentation to understand available user data