Getting Started
Quick start guide to integrate Upod into your website
This guide will help you get started with Upod in just a few minutes. We'll cover the basics and help you choose the right integration path.
Prerequisites
Before you begin, you'll need:
- A website or web application where you want to integrate Upod
- Contact us via email to register your application as an OIDC client
- Basic knowledge of JavaScript/HTML (helpful but not required)
Step 1: Register Your Application
Important: Before you can integrate Upod, you must register your application as a new OIDC client. This can be done by contacting us via email.
- Contact us via email to request OIDC client registration
- Provide us with:
- Your website URL(s)
- The redirect URI(s) where users will return after login
- We'll register your
client_idandredirect_uri(s) - You'll receive your
client_idwhich you'll use in your integration
Step 2: Choose Your Integration Path
Upod offers multiple integration approaches. Choose the one that best fits your needs:
Independent Widget
Embed a standalone widget with built-in login/logout buttons. Recommended for quick integration with minimal code changes.
Cookie Banner Integration
Add Upod as a third option in your existing cookie consent banner.
OIDC Provider
Use Upod as an OIDC provider for federated login. Best for existing authentication systems.
Cookie Decline Overlay
Show an overlay suggesting Upod when users decline cookies.
Integrations with Ad Servers
Connect Upod with advertising networks for personalized opt-out advertising.
What You Get
All integration paths result in:
- ✅ Authenticated users - Users can log in securely via Upod
- ✅ Anonymized user data - Access to user profile data (gender, age range, residence) without personal identifiers
- ✅ Privacy-first - No cookies required, user data is anonymized and stored securely
Quick Start Example
Here's a minimal example to get you started:
Install the Client Library
Include the Upod client library in your HTML:
<script src="https://cdn.upod.eu/client/bundle.browser.js"></script>Initialize Upod
Initialize the client with your credentials:
<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,
});
</script>Handle Authentication
Handle the OIDC callback and check authentication status:
client.handleCallbackIfNeeded().then(() => {
client.isAuthenticated().then(loggedIn => {
if (loggedIn) {
// User is logged in
loadPersonalizedContent();
} else {
// User is not logged in
loadGenericContent();
}
});
});Fetch User Profile Data
Once authenticated, fetch anonymized user profile data:
client.onLogin(() => {
client.fetch({ path: '/storage/profile', method: 'get' }).then(profile => {
console.log('Gender:', profile.gender);
console.log('Age Range:', profile.ageRange);
console.log('Residence:', profile.residence);
// Use profile data to personalize content
});
});Next Steps
- Choose an integration path from the options above
- Follow the specific integration guide for your chosen path
- Review the API Reference to understand data formats and available methods
- Test your integration using our live examples
Need Help?
- Review the API Reference for detailed information
- Check out our live examples
- Contact us if you need assistance with your integration