Custom registration flow

843 views
Skip to first unread message

L Vasseur

unread,
May 17, 2022, 3:36:38 AM5/17/22
to Keycloak User
Hello everyone,

I want to create a 100% new custom registration flow, with multiple pages (steppers), call external services to validate datas, register the user in Keycloak database and also in another one.

Which kind of SPI should I implement ?

I started by implement 3 FormAuthenticator each one with 1 FormAction as I have 3 steps in my registration flow. But as I don't want to register the user after the 1rst step, only at the end, I am not sure to doing it the good way.

Have you some advice or example to provide ?
Thanks a lot

Łukasz Dywicki

unread,
May 17, 2022, 8:28:10 AM5/17/22
to keyclo...@googlegroups.com
Hello,
If you need a custom registration flow you might need a combination of
authenticators, form providers and maybe action tokens.
In the customization past process was a bit more complicated (required
customization of form provider), but starting from I think KC11 it got
simplified. You can make on demand forms without replacements to core SPIs.
One point about building multi-step process is handling of mail actions
which might require you to provide a custom action token and handler
which will catch it and continue (redirect to registration) process from
there. Redirects and continuation of process can be controlled through
session notes.

Overall Authenticators can request rendering of custom forms with below
code:

private void displayForm(AuthenticationFlowContext
authenticationFlowContext, Map<String, String> contexts) {
LoginFormsProvider form = authenticationFlowContext.form();
form.setAttribute("contexts", contexts);
Response challenge = form.createForm("select-context.ftl");
authenticationFlowContext.challenge(challenge);
}

The select-context.ftl form needs to be located in
theme-resources/templates:

<#import "template.ftl" as layout>
<@layout.registrationLayout; section>
<#if section = "title">
${msg("loginTitle", realm.name)}
<#elseif section = "header">
Setup context
<#elseif section = "form">
<form id="kc-slect-context-form" class="${properties.kcFormClass!}"
action="${url.loginAction}" method="post">
<div class="${properties.kcFormGroupClass!}">
<div class="${properties.kcLabelWrapperClass!}">
<label for="context"
class="${properties.kcLabelClass!}">Access context</label>
<p>Please pick in which context you want to enter client.</p>
</div>
<div class="${properties.kcInputWrapperClass!}">
<!-- custom template attribute which is provided by
authenticator -->
<select class="form-control" name="context" id="context">
<option value="">Select context</option>
<#list contexts?keys as contextId>
<option value="${contextId}">${contexts[contextId]}</option>
</#list>
</select>
</div>
</div>

<div class="${properties.kcFormGroupClass!}">
<div id="kc-form-options"
class="${properties.kcFormOptionsClass!}">
<div class="${properties.kcFormOptionsWrapperClass!}">
</div>
</div>

<div id="kc-form-buttons"
class="${properties.kcFormButtonsClass!}">
<div class="${properties.kcFormButtonsWrapperClass!}">
<input class="${properties.kcButtonClass!}
${properties.kcButtonPrimaryClass!} ${properties.kcButtonLargeClass!}"
name="login" id="kc-login" type="submit" value="${msg("doSubmit")}"/>
</div>
</div>
</div>
</form>
</#if>
</@layout.registrationLayout>

Best,
Łukasz
--
Independent Open Source consultant ;-)
http://code-house.org | http://dywicki.pl
> --
> You received this message because you are subscribed to the Google
> Groups "Keycloak User" group.
> To unsubscribe from this group and stop receiving emails from it, send
> an email to keycloak-use...@googlegroups.com
> <mailto:keycloak-use...@googlegroups.com>.
> To view this discussion on the web visit
> https://groups.google.com/d/msgid/keycloak-user/6c0de28e-1789-4ff0-841b-1e9a5d0ba217n%40googlegroups.com
> <https://groups.google.com/d/msgid/keycloak-user/6c0de28e-1789-4ff0-841b-1e9a5d0ba217n%40googlegroups.com?utm_medium=email&utm_source=footer>.

Gayathri Balasubramanian

unread,
Sep 29, 2022, 2:23:45 PM9/29/22
to Keycloak User
Hi,

Did you happen to figure out a solution here? I am new here and have been trying to get a form rendered to get the mobile number and store it as user attribute. I want to render this page once the user enters the username and password.
I have been struggling with this for a long time now. Any help would be appreciated.

Thanks

Reply all
Reply to author
Forward
0 new messages