Использование keycloak в Vue3, но не при запуске

#javascript #vue.js #keycloak #vuejs3

#javascript #vue.js #keycloak #vuejs3

Вопрос:

У меня проблема с keycloak.js в моем приложении Vue3

 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)
})
 

У меня есть приведенный выше код в моем main.js досье. При этом запускается подстраница keycloak с логином / регистрацией. Если кто-то успешно входит в систему, запускается мое приложение Vue. Теперь, вместо вышеупомянутого, я хотел бы сделать так, чтобы приложение Vue запускалось независимо от пользователя, вошедшего в систему, а экран keycloak запускается ТОЛЬКО в том случае, если кто-то нажимает указанную кнопку в пользовательском интерфейсе. Я искал примеры в сети, но могу найти только те, которые запускают keycloak при запуске приложения. Кто-нибудь может помочь?

Ответ №1:

Измените значение onLoad с ‘login-required’ на ‘check-sso’. Этот параметр только проверяет, вошел ли пользователь в систему, не перенаправляя пользователя для входа в систему, и соответствующим образом настраивает свойства аутентификации.

Затем вы можете вызвать keycloak.login() , например, в вашем коде. При необходимости вместе с защитой маршрута.

Кроме того, поместите создание приложения из блока else, потому что оно не загрузится, если пользователь не вошел в систему, когда у вас есть ‘check-sso’.

Комментарии:

1. check-sso также можно назвать тихим. Для получения дополнительной информации см. Официальную документацию Keycloak для адаптера JavaScript .