Introduction
Keycloak is an open source identity and access management platform, and it provides support for standard protocols like OpenID Connect, OAuth 2.0, and SAML.
In this tutorial, SAML will be used in Keycloak to enable Single Sign-On (SSO) capability with Joget.
The SAML Directory Manager Plugin is available in the Joget Marketplace.
The plugin's source code is also available in JogetOSS Github. Projects under JogetOSS are community-driven and community-supported, and you are welcome to contribute to the projects.
This tutorial serves only as a general guide, using minimal-required configurations on Keycloak to enable SSO via SAML protocol with Joget.
To use Keycloak in a production environment, please see Configuring Keycloak for production or other relevant Keycloak guides.
Prerequisites
- Joget server
- Docker
Tutorial Steps
1. Keycloak Installation
To quickly get started on Keycloak and for ease of testing, we recommend installing Keycloak via Docker in your development environment.
Do follow the guide until the part where you have successfully created a sample user in Keycloak & verify by logging in with this new user credentials in the Keycloak Account Console.
Important Note
Since the default bundled Tomcat server hosting the Joget platform operates on port 8080 by default, do ensure the deployed Keycloak container does not clash with the same host port.
For example, you can map Keycloak container to expose on host port 8500 or any other non-clashing port instead.
2. Plugin Installation
Joget allows integration with any platform using SAML with help of SAML plugin which can be downloaded from the marketplace. Download the plugin and install the plugin in the manage plugins section.
https://marketplace.joget.org/jw/web/userview/mp/mpp/_/vad?id=wflow-saml-v5
Once you install the plugin, You need to whitelist the external API call so SAML API can be accessed from the end-users browser.
3. Plugin Configuration
Once you install the plugin you can enable the directory manager configuration to use SAML authentication.
Open settings-> Directory Manager Settings-> Select Plugin-> Choose SAML Directory Manager
SAML Directory Configuration setting screen will open. You will be required to copy the SAML API URL. This is required to create a client in the Keycloat.
IDP Certificates need to be copied from the admin console of the keycloak. Open your KeyCloak admin console->Realm Settings ->Keys Tab -> Click on the Certificate RSA 256 Key.
Paste this value in the IDP Certificate field.
User Provisioning Enabled checkbox will allow Joget to authenticate users who are not in joget directory manager. It will also create an account in joget.
Configure other settings as per your industry requirements.
4. KeyCloak Configuration
Creating a client in Keycloak will enable the SSO from the keycloak application.
Open the Keycloak admin console -> Clients-> Create
Please use the following configurations:
Client ID: SAML JOGET API URL
Name: Optional
Description: Optional
Enabled: ON
Consent Required: OFF
Login Theme: Optional
Client Protocol: SAML
Include AuthnStatement: ON
Include OneTimeUse Condition : OFF
Sign Documents: OFF
Sign Assertions: ON
Signature Algorithm: RSA_SHA256
SAML Signature Key Name: CERT_SUBJECT
Canonicalization Method: EXCLUSIVE
Encrypt Assertions: OFF
Client Signature Required: OFF
Force POST Binding: OFF
Front Channel Logout: OFF
Force Name ID Format: ON
Name ID Format: username
Root URL: EMPTY
Valid Redirect URIs: https://joget-Server-URL/jw
Base URL: EMPTY
Master SAML Processing URL: SAML JOGET API URL
IDP Initiated SSO URL Name: SAML JOGET API URL
To test configuration, you can copy the target IDP initiated SSO URL and paste it in incognito mode of browser and login to keycloak, If all is good you will be redirected to Joget home page with login.
The final configuration is the configure the fields.
Open the Mapper tab on the client configuration. Add the Built-in mappings 
You need to define the names for each option so joget will be able to handle the values
Mapping Name | SAML Attribute Name |
X500 surname | User.LastName |
X500 givenName | User.FirstName |
X500 email |
Optional Modifications
To allow end users to SSO via Keycloak with a convenient button in your Joget login page, you can use the sample code snippet below.
Edit the App Center app, navigate to UI builder -> Settings -> Login Page UI --> Custom HTML (After Login Form), then paste in the code snippet below.
<div class="custom-logins" style="place-items: center; width: 100%;">
<hr>
<a href='{Your-target-IDP-initiated-SSO-URL}' class='btn' style="display: block; width: 100%;">Login with Keycloak</a>
</div>
<script>
$(document).ready(function() {
const customLogins = $("div.custom-logins").detach();
$('#loginForm table').after(customLogins);
});
</script>
Result:
