Setup with Supabase

How to use Rollup ID with Supabase

Overview

As of April 2023, Supabase does not support the OIDC standard as a form of authentication. As a workaround, Rollup repurposes their Keycloak plugin to achieve the same effect.

This involves multiple redirects:

In order to implement these hops, configure Rollup, Supabase, and your app as follows:

Console Configuration

Request authorization for the Email scope and set the Redirect URL to the Supabase Keycloak provider's redirect URL. You can get the redirect URL from the Keycloak provider configuration (see below).

Rollup Console Configuration for the Supabase callback and required scopes.

Required scope values are:

• Email

• Profile

OpenID is an optional scope suggested for standards-compliant OIDC connections.

Save and publish your application.

Supabase Configuration

Within Supabase, select "Authentication" a nd then under "Configuration" select "Providers" and under the "Email" settings disable "Confirm Email" and save.

Next go to the Keycloak settings and enable Keycloak.

Update your Keycloak configuration's Client ID and secret with the values from your Rollup Console Application.

Set your Keycloak Realm to https://passport.rollup.id (the screenshot below shows our development environment).

Copy your callback URL here and use it in your Rollup Console Application configuration (see above).

Keycloak provider configuration for Supabase.

Save your settings.

App Configuration

Within your application, use the Supabase library to sign the user in with the configured Keycloak provider:

const { createClient } = supabase // This comes from the supabase-js import or script tag load.
const Supabase = createClient('YOUR_SUPABASE_APP_URL', 'YOUR_SUPABASE_PUBLIC_API_KEY')
const { data, error } = await Supabase.auth.signInWithOAuth({
  provider: 'keycloak',
  options: {
    redirectTo: 'https://YOUR_APP_REDIRECT_URL'
  },
})