Dashy will not load when using Keycloak authentication

[maxall41]

Hi. I'm trying to setup Keycloack authentication for Dashy but the dashboard page keeps reloading and saying:

Refused to frame 'http://192.168.1.189:8080/' because an ancestor violates the following Content Security Policy directive: "frame-ancestors 'self'".

Note: 192.168.1.189 is the IP for the keycloak server

in the error log, all of my configuration details seem to be correct and the keycloak server seems fine so I think this is some sort of issue with either my Dashy config or Dashy itself. Does anybody know anything about this? Here is my dashy config:

appConfig:
  theme: callisto
  layout: auto
  iconSize: medium
  language: en
  startingView: default
  defaultOpeningMethod: newtab
  statusCheck: true
  statusCheckInterval: 0
  faviconApi: allesedv
  routingMode: history
  enableMultiTasking: false
  widgetsAlwaysUseProxy: false
  webSearch:
    disableWebSearch: false
    searchEngine: duckduckgo
    openingMethod: newtab
    searchBangs: {}
  enableFontAwesome: true
  hideComponents:
    hideHeading: false
    hideNav: false
    hideSearch: false
    hideSettings: false
    hideFooter: false
  auth:
    enableGuestAccess: true
    enableKeycloak: true
    keycloak:
      serverUrl: http://192.168.1.189:8080
      realm: sb-dashboard
      clientId: sb-dashboard-client
  showSplashScreen: true
  preventWriteToDisk: false
  preventLocalSave: false
  disableConfiguration: false
  allowConfigEdit: true
  enableServiceWorker: false
  disableContextMenu: false
  disableUpdateChecks: false
  disableSmartSort: false
  enableErrorReporting: false
pageInfo:
  title: Main Dashboard
  description: Welcome to your new dashboard!
  navLinks:
    - title: GitHub
      path: https://github.com/Lissy93/dashy
    - title: Documentation
      path: https://dashy.to/docs
  footerText: ""
sections:
  - name: Services
    icon: fas fa-cloud
    displayData:
      sortBy: default
      rows: 1
      cols: 2
      collapsed: false
      hideForGuests: false
    items:
      - title: Home assistant
        description: Home automation
        icon: fas fa-home
        url: http://192.168.1.239:30585/
        target: newtab
        statusCheckAllowInsecure: true
        id: 0_836_homeassistant
      - title: Paperless
        description: A safe place to store your documents
        icon: fas fa-leaf
        url: http://192.168.1.239:31858/
        target: newtab
        statusCheckAllowInsecure: true
        id: 1_836_paperless
  - name: Networking
    icon: fas fa-network-wired
    displayData:
      sortBy: default
      rows: 1
      cols: 1
      collapsed: false
      hideForGuests: false
    items:
      - title: DNS
        description: Pihole & Unbound
        icon: fas fa-server
        url: http://192.168.1.30/admin
        target: newtab
        statusCheckAllowInsecure: true
        id: 0_1064_dns
  - name: Authentication
    icon: fad fa-user-secret
    displayData:
      sortBy: default
      rows: 1
      cols: 1
      collapsed: false
      hideForGuests: true
    items:
      - title: KeyCloack
        description: Authentication Service
        icon: fas fa-lock
        url: http://auth-server.local:8080
        target: newtab
        statusCheckAllowInsecure: true
        id: 0_1472_keycloack

[Lissy93]

This is a CORS error, you can see the Troubleshooting guide for more info
But what's weird is that, that specific CORS error implies your opening the app within an iframe. It can be fixed with X-Frame-Options: ALLOW / specify path of where your running Dashy.

[maxall41]

Where would i specify X-Frame-Options: in the Key-cloak config or somewhere in the Dashy config?

[Lissy93]

On the keycloak side
There are some other discussions related to this you can reference. It's usually Access-Control-Allow-Origin [URL-of Dashy]