- • Quickstart
- • Documentation
- • Documentation DevOps
- • Next Steps
- • Spring Boot
- • Spring Data
- • Spring Data MongoDB
- › Spring Security
- • Frontend
- • Multi-Module
Last updated: 2023-04-30
Supporting OAuth with Spring Boot and HTMX
Suppose we have connected our Spring Boot application to a Keycloak server via OAuth / OIDC, as described in this article. Now when we call a protected resource, Spring Boot will detect the lack of authentication and automatically redirect us to the Keycloak login. When our initial click was handled by HTMX, the browser will display the following error in the console.
The browser has correctly detected that the origin has changed and Keycloak is not allowing it. Therefore, the CORS (Cross-Origin Resource Sharing) error is issued in the console in the browser. However, without HTMX, the error would not have occurred - so what can we do to avoid the CORS error? To fix this, we first add our own
OAuthRedirectStrategy to the application.
Creating a custom RedirectStrategy
If via the
HX-Request header a HTMX request has been recognized, the response will be modified. Instead of a real redirect, the
HX-Redirect header will now be returned - so rather than redirecting the Ajax request, HTMX will recognize the new header in the response and initiate a real browser redirect. With this change we fix the CORS error and at the same time ensure that the Keycloak login page will not run in the HTMX context.
Lastly, we now configure OAuth to use our new redirect strategy. Instead of
.oauth2Login(withDefaults()) we write:
Adjusting our security config
The Bootify Builder includes the Security tab in the Professionel plan, where Keycloak can be enabled for the frontend. If the option for HTMX has been activated, the
OAuthRedirectStrategy as well as its configuration is automatically added to the source code.