Use Keycloak as the only way of logging into a Budibase app

This article is about software development with the low-code platform Budibase. We are using the free self-hosted open source version of Budibase.

I want our users to immediately understand the registration and login workflow.

Challenge:

At my organization, we are using Keycloak as the single sign-on (SSO) provider for many services. Budibase has its own registration and login. We want to avoid that our users even see the Budibase login. Everyone should use the more powerful, more manageable SSO login.

How we solved it:

“START”: An app to check login status and set the roles for all other apps.

This very simple app called “START” has only one screen containing just one component. The screen is publicly accessible.

Redirecting to Keycloak (or any other OIDC provider)

When users are not logged into Budibase yet, we need to send them to Keycloak directly (not to the Budibase login). This is the task of our only one component, an Embed. As a condition, it has this:

As the embed content, we use this:

<img style="display: none;" src onerror="
    if (!location.href.match('builder') && !location.href.match('preview')) {
        // After successful login, come back to this app for rights assignment
        document.cookie = 'budibase:returnurl = /app/start; path=/';

        // Keycloak login; replace with your own id before use
        location.href = '/api/global/auth/default/' + 
            'oidc/configs/c80f4be4f024a43228f2617a537997b4e';
    }
">

The if is important to avoid triggering the redirect while designing the app. We use this onerror attribute to run a bit of JavaScript in the browser. Normally though, all Budibase Javascript runs on the server, not in the browser.

The provider id, in our case c80f4be4f024a43228f2617a537997b4e is generated internally by Budibase. You can find yours by looking at the JSON response to /api/global/configs/public/oidc?tenantId=default

Setting permissions

When Budibase creates a new user for an OICD, the user has no app permissions. To fix this, we use a REST call with the verb PUT to set the "roles" key for the logged-in user. Then, we redirect users to the most important app.