CORS issue on Keycloak Login Form

Hi everyone,

I’m working on a few applications that use Keycloak for authentication and I’m running into issues with CORS configuration.

In my use case, I have custom login/registration screens for my applications. The application retrieves the Keycloak login form and populates it with the username/password from my application login screen and submits that on behalf of the user. The redirect comes back and the client application is able to retrieve an access token for the user. The same flow happens for registration - the login form is parsed for the registration form, the registration form is populated by my client application, and submitted on behalf of the user.

This all worked great on mobile, but I’m running into issues in the browser due to CORS now that I am developing a web application. The Keycloak login form is lacking an Access-Control-Allow-Origin header, and I cannot figure out how to configure these in Keycloak. Is this not possible?

One option I have considered is just redirecting to the Keycloak login page, and then back to my application. These seems like the most straightforward and well documented approach, but I’d like users to stay within my application if possible.

I’ve also considered creating a public client and setting it up for a direct access grant, to allow the client to retrieve a token from Keycloak without using the login form. I’m not sure I fully understand the security implications here, and I don’t see a way around encountering the same CORS issues with registration (is there a direct access grant equivalent for registering a user in keycloak?).

Any guidance or input would be greatly appreciated.