'Keycloak CSS is not updating in browser

I am upgrading Keycloak from 9.x to 12.x in a development environment. I initially copied some custom themes forward, and found that the styling was badly broken (no surprise). I reviewed my FTL files, copied some of the core changes into my theme, and things are much better - just some minor issues to adjust.

Now the problem. I've made the changes to my login.css file, but those changes aren't showing up in the browser. It continues to fetch an old version of my custom CSS file.

What I have tried (multiple times for most of these):

  • Clear browser cache
  • Restart Keycloak
  • Check ownership/permissions of theme files
  • Restart entire server
  • Load CSS file directly
  • Load CSS file directly with meaningless parameter added (trying to bypass any possible middleman caching)
  • Confirm new version of Keycloak is the one running
  • Load page in other browsers

I've also now grepped the entire Keycloak directory for some of the CSS rules I've removed, and I can't find any copies of the "old" css file anywhere that might be getting referenced by accident.

Also, there are no messages in the Keycloak log when loading the CSS file.

I want to figure out how to get Keycloak to deliver the updated CSS to the browser.



Solution 1:[1]

Blind guess, so please don't blame me if it doesn't work. (question should include minimal reproducible example):

Edit /opt/jboss/keycloak/standalone/configuration/standalone-ha.xml and update it as follows:

<theme>
  <staticMaxAge>-1</staticMaxAge>
  <cacheThemes>false</cacheThemes>
  <cacheTemplates>false</cacheTemplates>
  
  ...
  
</theme>

Solution 2:[2]

For me it worked when changed this file standalone.xml like below way

<cacheThemes>false</cacheThemes>
<cacheTemplates>false</cacheTemplates>

I think it is because I am using single instance mode instead cluster ha mode.

Solution 3:[3]

Apart from disabling cache, as described above, you can also adjust the theme resource URLs, breaking the client-side cache. It's a bit of a hack, but you can directly modify the resource tag portion of the URL by adjusting the database migration_model.id value.

references:

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Jan Garaj
Solution 2 Nalin Kularathna
Solution 3 Andrew Forman