Integrating Keycloak with Social Identity Providers in Authentication Flows
TypeScriptIntegrating Keycloak with social identity providers allows users to log in using their social media accounts, offering a convenient method of authentication. To implement this functionality, we use Pulumi resources from the Keycloak provider.
We'll first create a Keycloak Realm, which is a top-level unit in Keycloak, similar to a tenant. Within this realm, we'll set up an Identity Provider (IdP) representing our social provider (e.g., Google, Facebook, GitHub, etc.). Keycloak supports a range of social identity providers out of the box.
Here's how to achieve this with Pulumi and TypeScript:
- Define a Keycloak Realm.
- Set up an Identity Provider linked to a social provider within the realm.
- Define an authentication flow that includes social identity provider login.
Here's a sample TypeScript program with detailed comments that executes these steps:
import * as keycloak from "@pulumi/keycloak"; // Create a new Keycloak Realm. const myRealm = new keycloak.Realm("myRealm", { // The realm's name. It can be any name that helps you identify the realm. realm: "myRealm", // Ensure the realm is enabled. enabled: true, }); // Add a Keycloak OpenID Connect client. // Here, for demonstration purposes, we're using 'google' as the social identity provider. const googleIdentityProvider = new keycloak.openid.Client("googleIdentityProvider", { // The realm to which this identity provider belongs. realmId: myRealm.id, // The name of the identity provider. clientId: "google", // The base URL of the client, which is typically the URL where your application is hosted. baseUrl: "http://localhost:3000/", // Specify the client authentication method; 'client_secret' is common. clientAuthenticatorType: "client_secret_jwts", // A list of redirect URIs. validRedirectUris: [ "http://localhost:3000/*" ], // OpenID Connect flow enabled flags. standardFlowEnabled: true, implicitFlowEnabled: false, directAccessGrantsEnabled: true, // Force 'consent' to ensure the user grants permission explicitly. consentRequired: true, // A secret associated with the client; it's important to keep it secure. clientSecret: "your-client-secret", // This should be a secure, generated secret. }); // Now we define our custom Keycloak Authentication Flow that includes the social provider. const myAuthenticationFlow = new keycloak.authentication.Flow("myAuthenticationFlow", { // Again, link it with the realm we created. realmId: myRealm.id, // The flow's alias. alias: "social-provider-flow", // This flow should be used for browser login methods. providerId: "browser", // A description for the flow. description: "Browser flow that allows social login", // Enable the use of this flow. topLevel: true, // Build the flow with a social provider. builtIn: false }); // Finally, create an execution to integrate Google as an Identity Provider within the flow. const googleExecution = new keycloak.authentication.Execution("googleExecution", { // Specify the realm and the flow where this execution will exist. realmId: myRealm.id, parentFlowAlias: myAuthenticationFlow.alias, // Use the authenticator that matches your social provider; this alias must match one available in Keycloak. authenticator: "identity-provider-redirector", // The requirement sets how the authenticator is used within the flow. requirement: "ALTERNATIVE" }); // Export values to access our Keycloak realm and identity provider outside of Pulumi. export const realmName = myRealm.realm; export const identityProviderClientId = googleIdentityProvider.clientId;
In the above program, a Keycloak Realm is created, under which a Google OpenID Connect client is registered. A custom authentication flow is defined, incorporating the Google Identity Provider with the help of an Execution resource.
Make sure to replace placeholders like
your-client-secret
with actual sensitive values. It is a best practice to manage these secrets using a secret manager or Pulumi's secret management rather than hard-coding them into your code.This program assumes that you've already registered your application with Google to get the client ID and secret, and have the correct redirect URIs configured in the Google Developer Console.
To execute this Pulumi program, save it to a file with a
.ts
extension (e.g.,keycloak-setup.ts
), and runpulumi up
via your command line in the same directory as your file. Ensure you have the Keycloak provider configured in your Pulumi setup.