KeycloakStrategy
The Keycloak strategy is used to authenticate users against an Keycloak account. It extends the OAuth2Strategy.
Supported runtimes
Runtime | Has Support |
---|
Node.js | ✅ |
Cloudflare | ✅ |
Usage
Create the strategy instance
import { Authenticator } from "remix-auth";
import { Keycloak } from "remix-auth-keycloak";
export const authenticator = new Authenticator<User>(sessionStorage);
let keycloakStrategy = new KeycloakStrategy(
{
useSSL: true,
domain: "example.app",
realm: "example",
clientID: "YOUR_CLIENT_ID",
clientSecret: "YOUR_CLIENT_SECRET",
callbackURL: "your.app/callback",
},
async ({ accessToken, refreshToken, extraParams, profile }) => {
return User.findOrCreate({ email: profile.emails[0].value });
}
);
authenticator.use(keycloakStrategy);
Setup your routes
export default function Login() {
return (
<Form action="/auth/keycloak" method="post">
<button>Login with Keycloak</button>
</Form>
);
}
import type { ActionFunction, LoaderFunction } from "remix";
import { authenticator } from "~/utils/auth.server";
export let loader: LoaderFunction = () => redirect("/login");
export let action: ActionFunction = ({ request }) => {
return authenticator.authenticate("keycloak", request);
};
import type { ActionFunction, LoaderFunction } from "remix";
import { authenticator } from "~/utils/auth.server";
export let loader: LoaderFunction = ({ request }) => {
return authenticator.authenticate("keycloak", request, {
successRedirect: "/dashboard",
failureRedirect: "/login",
});
};