Skip to content

Commit

Permalink
Add keycloak npm library.
Browse files Browse the repository at this point in the history
  • Loading branch information
@fergmac
fergmac committed Sep 20, 2024
1 parent 9bda857 commit 3fb7af9
Show file tree
Hide file tree
Showing 4 changed files with 80 additions and 82 deletions.
21 changes: 21 additions & 0 deletions app/frontend/package-lock.json
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

3 changes: 2 additions & 1 deletion app/frontend/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -37,7 +37,8 @@
"vue-router": "^3.0.1",
"vue-select": "^3.1.0",
"vuejs-noty": "^0.1.3",
"vuex": "^3.0.1"
"vuex": "^3.0.1",
"keycloak-js": "18.0.0"
},
"devDependencies": {
"@vue/cli-plugin-babel": "^3.7.0",
Expand Down
96 changes: 44 additions & 52 deletions app/frontend/src/common/authenticate.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@
limitations under the License.
*/
import ApiService from '@/common/services/ApiService.js'
import Keycloak from 'keycloak-js';
import Vue from 'vue'

export default {
Expand All @@ -33,7 +34,7 @@ export default {
const keyCloakScript = document.createElement('script')
keyCloakScript.onload = () => {
// Construct the Keycloak object and resolve the promise.
Vue.prototype.$keycloak = new Keycloak(response.data)
Vue.prototype.$keycloak = new Keycloak(response.data)
resolve(Vue.prototype.$keycloak)
}
keyCloakScript.onerror = (e) => {
Expand Down Expand Up @@ -92,7 +93,6 @@ export default {
}
this.scheduleRenewal(instance)
}).catch((e) => {
console.log(e)
// The refresh token is expired or was rejected
// we will retry after 60 sec (up to the count defined by maxRetries)
if (retries > maxRetries) {
Expand All @@ -113,61 +113,53 @@ export default {
return new Promise((resolve, reject) => {
this.getInstance()
.then((instance) => {
console.log("INSTANCE: ", instance)
if (instance.authenticated && ApiService.hasAuthHeader() && !instance.isTokenExpired(0)) {
// We've already authenticated, have a header, and we've not expired.
resolve(instance)
} else {

this.removeLocalToken()
instance.clearToken()
// We update the store reference only after wiring up the API. (Someone might be waiting
// for login to complete before taking some action. )
store.commit('SET_KEYCLOAK', instance)
resolve(instance)
// Attempt to retrieve a stored token, this may avoid us having to refresh the page.
// const token = localStorage.getItem('token')
// const refreshToken = localStorage.getItem('refreshToken')
// const idToken = localStorage.getItem('idToken')
// instance.init({
// pkceMethod: 'S256',
// onLoad: 'check-sso',
// checkLoginIframe: true,
// timeSkew: 10, // Allow for some deviation
// token,
// refreshToken,
// idToken,
// }
// ).then((result) => {
// if (instance.authenticated) {
// // We may have been authenticated, but the token could be expired.
// instance.updateToken(60).then(() => {
// // Store the token to avoid future round trips, and wire up the API
// this.setLocalToken(instance)
// // We update the store reference only after wiring up the API. (Someone might be waiting
// // for login to complete before taking some action. )
// // Assumes that store passed in includes a 'SET_KEYCLOAK' mutation!
// store.commit('SET_KEYCLOAK', instance)
// this.scheduleRenewal(instance)
// resolve(instance)
// }).error(() => {
// // The refresh token is expired or was rejected
// this.removeLocalToken()
// instance.clearToken()
// // We update the store reference only after wiring up the API. (Someone might be waiting
// // for login to complete before taking some action. )
// store.commit('SET_KEYCLOAK', instance)
// resolve(instance)
// })
// } else {
// // We may have failed to authenticate, for many reasons, e.g. - it may be we never logged in,
// // or have an expired token.
// store.commit('SET_KEYCLOAK', instance)
// resolve(instance)
// }
// }).then((e) => {
// reject(e)
// })
const token = localStorage.getItem('token')
const refreshToken = localStorage.getItem('refreshToken')
const idToken = localStorage.getItem('idToken')
instance.init({
pkceMethod: 'S256',
onLoad: 'check-sso',
checkLoginIframe: true,
timeSkew: 10, // Allow for some deviation
token,
refreshToken,
idToken,
}
).then((result) => {
if (instance.authenticated) {
// We may have been authenticated, but the token could be expired.
instance.updateToken(60).then(() => {
// Store the token to avoid future round trips, and wire up the API
this.setLocalToken(instance)
// We update the store reference only after wiring up the API. (Someone might be waiting
// for login to complete before taking some action. )
// Assumes that store passed in includes a 'SET_KEYCLOAK' mutation!
store.commit('SET_KEYCLOAK', instance)
this.scheduleRenewal(instance)
resolve(instance)
}).error(() => {
// The refresh token is expired or was rejected
this.removeLocalToken()
instance.clearToken()
// We update the store reference only after wiring up the API. (Someone might be waiting
// for login to complete before taking some action. )
store.commit('SET_KEYCLOAK', instance)
resolve(instance)
})
} else {
// We may have failed to authenticate, for many reasons, e.g. - it may be we never logged in,
// or have an expired token.
store.commit('SET_KEYCLOAK', instance)
resolve(instance)
}
}).then((e) => {
reject(e)
})
}
})
.catch((error) => {
Expand Down
42 changes: 13 additions & 29 deletions app/frontend/src/common/components/Auth.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -38,36 +38,20 @@ export default {
}
},
async keyCloakLogin () {
try {
const authenticated = await this.keycloak.init({
flow: 'standard'
this.keycloak.init().then(() => {
this.keycloak.login({ idpHint: this.config.sso_idp_hint }).then((authenticated) => {
if (authenticated) {
ApiService.authHeader('JWT', this.keycloak.token)
if (window.localStorage) {
localStorage.setItem('token', this.keycloak.token)
localStorage.setItem('refreshToken', this.keycloak.refreshToken)
localStorage.setItem('idToken', this.keycloak.idToken)
}
}
}).catch((e) => {
this.$store.commit(SET_ERROR, { error: 'Cannot contact SSO provider' })
})
console.log("Authenticated: ", authenticated)
} catch(error) {
console.error("Failed to initialize Keycloak: ", error);
}
// console.log("before init")
// this.keycloak.init({
// adapter: 'default',
// flow: 'implicit'
// }).then(() => {
// console.log("keyCloakLogin .then()")
// this.keycloak.login({ idpHint: this.config.sso_idp_hint }).then((authenticated) => {
// if (authenticated) {
// ApiService.authHeader('JWT', this.keycloak.token)
// if (window.localStorage) {
// localStorage.setItem('token', this.keycloak.token)
// localStorage.setItem('refreshToken', this.keycloak.refreshToken)
// localStorage.setItem('idToken', this.keycloak.idToken)
// }
// }
// }).catch((e) => {
// console.log("keyCloakLogin ERROR: ", e)
// this.$store.commit(SET_ERROR, { error: 'Cannot contact SSO provider' })
// })
// })
})
},
keyCloakLogout () {
// This should log the user out, but unfortunately does not delete the cookie storing the user
Expand Down

0 comments on commit 3fb7af9

Please sign in to comment.