Keycloak: Update user password in AngularJS application

Question

I'm building an AngularJS application protected by Keycloak. Each user should update his password within his user profile.

Calling the Keycloak API for password

GET /auth/realms/{realm_name}/account/password

returns HTML content from Keycloak. I would like to build my own form to update a user's password.

In the Keycloak documentation I found

POST /auth/realms/{realm_name}/account/password

which requires the attributes

{
    'password' => user's current password
    'password-new' => new password
    'password-confirm' => new password again
    'stateChecker' => token from keycloak
}

Calling

POST /auth/realms/{realm_name}/account/password

without the 'stateChecker' attribute causes an error. This attribute is needed.

So here are my questions:

• How do I get the value for stateChecker from keycloak for the logged in user (in Keycloak it's in a hidden input field)?
• Is there another possibility to change a user's password with a REST API call?

Thanks in advance.

Note:

Calling:

POST /auth/realms/{realm_name}/account/password

with hard coded attributes and values

{
    'password': 'somepasswd',
    'password-new': 'someNEWpasswd',
    'password-confirm': 'someNEWpasswd',
    'stateChecker': '<token copied and pasted from keycloak>',
}

is working!

Answer 1

My advice would be to overwrite the keycloak theme (check this out: http://docs.jboss.org/keycloak/docs/1.2.0.Beta1/userguide/html/themes.html).

You can extend and modify the existing forms to look like the rest of your application.

Answer 2

Finally I ended up with an own implementation of a rest endpoint using keycloaks admin rest api.

Building an own theme could be a solution too, as Lisa stated.