diff --git a/.env.development b/.env.development index 00ef464..85b1134 100644 --- a/.env.development +++ b/.env.development @@ -5,7 +5,7 @@ HOST=localhost # vue.js env variables VUE_APP_KEYCLOAK_BASE_URL=http://localhost:81/ -VUE_APP_KEYCLOAK_AUTH_URL=http://localhost:81/auth/ +VUE_APP_KEYCLOAK_AUTH_URL=http://localhost:81/ VUE_APP_KEYCLOAK_REALM=gendercomics VUE_APP_KEYCLOAK_REDIRECT_URL=http://localhost:8080/ diff --git a/package.json b/package.json index 8e47b0a..e9cfe5c 100644 --- a/package.json +++ b/package.json @@ -20,7 +20,7 @@ "bootstrap-vue": "^2.23.1", "core-js": "^3.49.0", "dayjs": "^1.11.20", - "keycloak-js": "^7.0.1", + "keycloak-js": "^26.2.0", "lodash": "^4.18.1", "normalize.css": "^8.0.1", "regenerator-runtime": "^0.14.1", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 27e5351..4ddbd38 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -36,8 +36,8 @@ importers: specifier: ^1.11.20 version: 1.11.20 keycloak-js: - specifier: ^7.0.1 - version: 7.0.1 + specifier: ^26.2.0 + version: 26.2.4 lodash: specifier: ^4.18.1 version: 4.18.1 @@ -3668,9 +3668,6 @@ packages: resolution: {integrity: sha512-efJLHhLjIyKRewNS9EGZ4UpI8NguuL6fKkhRxVuMmrGV2xN/0APGdQYwLFky5w9naebSZ0OwAGp0G6/2Cg90rA==} engines: {node: '>=0.6.0'} - js-sha256@0.9.0: - resolution: {integrity: sha512-sga3MHh9sgQN2+pJ9VYZ+1LPwXOxuBJBA5nrR5/ofPfuiJBE2hnjsaN8se8JznOmGLN2p49Pe5U/ttafcs/apA==} - js-tokens@4.0.0: resolution: {integrity: sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==} @@ -3737,8 +3734,8 @@ packages: resolution: {integrity: sha512-P2bSOMAc/ciLz6DzgjVlGJP9+BrJWu5UDGK70C2iweC5QBIeFf0ZXRvGjEj2uYgrY2MkAAhsSWHDWlFtEroZWw==} engines: {node: '>=0.6.0'} - keycloak-js@7.0.1: - resolution: {integrity: sha512-gefTlb6DjvqH2wTbXCs3o2d54Ot6lvFb0ynF4aU75ucUq9qQ1p1+lm+1OcRRC34nPCG16joPz2QNxNVXi8Bmng==} + keycloak-js@26.2.4: + resolution: {integrity: sha512-PnXpR3ubETGOt0B/Qt2lxmPbkZr5bc3vlQsOqDoTPPQsZRp7JjhTKxlJ187uWh8qJhvBab6Gsjb06a8ayOPfuw==} keyv@4.5.4: resolution: {integrity: sha512-oxVHkHR/EJf2CNXnWxRLW6mg7JyCCUcG0DtEGmL2ctUo1PNTin1PUil+r/+4r5MpVgC/fn1kjsx7mjSujKqIpw==} @@ -6834,7 +6831,9 @@ snapshots: source-map: 0.6.1 string-length: 2.0.0 transitivePeerDependencies: + - bufferutil - supports-color + - utf-8-validate '@jest/schemas@28.1.3': dependencies: @@ -6866,7 +6865,9 @@ snapshots: jest-runner: 24.9.0 jest-runtime: 24.9.0 transitivePeerDependencies: + - bufferutil - supports-color + - utf-8-validate '@jest/transform@24.9.0': dependencies: @@ -10338,8 +10339,6 @@ snapshots: js-message@1.0.7: {} - js-sha256@0.9.0: {} - js-tokens@4.0.0: {} js-yaml@3.14.1: @@ -10426,10 +10425,7 @@ snapshots: json-schema: 0.4.0 verror: 1.10.0 - keycloak-js@7.0.1: - dependencies: - base64-js: 1.3.1 - js-sha256: 0.9.0 + keycloak-js@26.2.4: {} keyv@4.5.4: dependencies: diff --git a/src/main.js b/src/main.js index 563b251..8cfcd41 100644 --- a/src/main.js +++ b/src/main.js @@ -1,7 +1,7 @@ import Vue from 'vue'; import App from './App.vue'; import router from './router'; -import * as Keycloak from 'keycloak-js'; +import Keycloak from 'keycloak-js'; import VueLogger from 'vuejs-logger'; import BootstrapVue from 'bootstrap-vue'; import './styles/styles.scss'; @@ -84,7 +84,7 @@ let initOptions = { onLoad: 'login-required', }; -Vue.prototype.keycloak = Keycloak(initOptions); +Vue.prototype.keycloak = new Keycloak(initOptions); Vue.prototype.moment = dayjs; Vue.prototype.$statusOptions = ['DRAFT', 'CLARIFICATION', 'REVIEW', 'FINAL']; Vue.prototype.$typeOptions = [ @@ -100,7 +100,7 @@ Vue.use(BootstrapVue); Vue.prototype.keycloak .init({ onLoad: initOptions.onLoad }) - .success((auth) => { + .then((auth) => { if (!auth) { window.location.reload(); } else { @@ -117,6 +117,6 @@ Vue.prototype.keycloak Vue.prototype.keycloak.refreshToken ); }) - .error(() => { + .catch(() => { Vue.$log.error('Authentication failed!'); }); diff --git a/src/router.js b/src/router.js index 105cd36..c889a80 100644 --- a/src/router.js +++ b/src/router.js @@ -16,7 +16,6 @@ import Predicates from './views/Predicates'; Vue.use(Router); -let authServerUrl = process.env.VUE_APP_KEYCLOAK_BASE_URL; let redirectURI = process.env.VUE_APP_KEYCLOAK_REDIRECT_URL; const authService = new AuthService(); @@ -132,11 +131,8 @@ export default new Router({ { path: '/logout', beforeEnter() { - location.href = - authServerUrl + - 'auth/realms/gendercomics/protocol/openid-connect/logout?redirect_uri=' + - redirectURI; authService.clear(); + Vue.prototype.keycloak.logout({ redirectUri: redirectURI }); }, }, ], diff --git a/src/services/httpclient.js b/src/services/httpclient.js index b9f1801..028b897 100644 --- a/src/services/httpclient.js +++ b/src/services/httpclient.js @@ -18,14 +18,14 @@ const authService = new AuthService(); const requestInterceptor = (config) => { Vue.prototype.keycloak .updateToken(30) - .success(() => { + .then(() => { Vue.$log.debug('successfully got new token'); authService.storeTokens( Vue.prototype.keycloak.token, Vue.prototype.keycloak.refreshToken ); }) - .error(() => { + .catch(() => { Vue.$log.error('updateToken error'); }); @@ -49,9 +49,9 @@ const responseInterceptor = httpClient.interceptors.response.use( Vue.$log.debug('response-interceptor: trying token refresh'); - Vue.prototype.keycloak + return Vue.prototype.keycloak .updateToken(30) - .success(() => { + .then(() => { authService.storeTokens( Vue.prototype.keycloak.token, Vue.prototype.keycloak.refreshToken @@ -61,7 +61,7 @@ const responseInterceptor = httpClient.interceptors.response.use( 'Bearer ' + authService.getAccessToken(); return httpClient(error.response.config); }) - .error(() => { + .catch(() => { Vue.$log.error('token refresh failed'); authService.clear(); return Promise.reject(error);