Using keycloak in Vue3, but not on startup

Getting advice
1

I have a problem with keycloak.js in my Vue3 application

const keycloak = Keycloak(keycloakOptions)

keycloak.init({
  onLoad: 'login-required',
  checkLoginIframe: false
}).then(async (auth) => {
  if (!auth) {
    window.location.reload()
  } else {
    const app = createApp(App)
    app.provide(process.env.VUE_APP_KEYCLOAK_PROVIDE_VARIABLE, keycloak)
    app.use(store)

    await store.dispatch('keycloakStore/fillRoles', keycloak.realmAccess.roles)

    app.use(router)
    app.mount('#app')
  }
}).catch((e) => {
  console.log('Serwer lezy: ' + e)
})

I have the above code in my main.js file. This runs the keycloak subpage with login/register. If someone succesfully logs in, my Vue app starts. Now, instead of the above, I’d like to make it so the Vue app starts regardless of the person being logged in and the keycloak screen is ONLY launched if someone clicks a specified button in the UI. I’ve searched examples on the net, but i can only find ones that run keycloak on application start. Can someone help?

2

Hey
I am trying also to init keycloak in certain routes if the user is not authenticated.
Did you find a solution?