Skip to content
Snippets Groups Projects
Commit 23ad2361 authored by damjan.murn@xlab.si's avatar damjan.murn@xlab.si
Browse files

Keycloak integration

parent 52782b16
No related branches found
No related tags found
No related merge requests found
Pipeline #106953 failed
VUE_APP_API="http://localhost:8080" VUE_APP_API="http://localhost:8080"
VUE_APP_KEYCLOAK_URL="https://catalogue-keycloak-dev.k8s.medina.esilab.org/auth"
\ No newline at end of file
VUE_APP_API="<<CCE_API_URL>>" VUE_APP_API="<<CCE_API_URL>>"
VUE_APP_KEYCLOAK_URL="<<KEYCLOAK_URL>>"
URL="${CCE_API_URL:-https://cce-api-dev.k8s.medina.esilab.org}" URL="${CCE_API_URL:-https://cce-api-dev.k8s.medina.esilab.org}"
sed -i "s|<<CCE_API_URL>>|${CCE_API_URL}|g" /usr/share/nginx/html/js/app.*.js sed -i "s|<<CCE_API_URL>>|${CCE_API_URL}|g" /usr/share/nginx/html/js/app.*.js
sed -i "s|<<KEYCLOAK_URL>>|${KEYCLOAK_URL}|g" /usr/share/nginx/html/js/app.*.js
nginx -g 'daemon off;' nginx -g 'daemon off;'
...@@ -29,7 +29,8 @@ ...@@ -29,7 +29,8 @@
"vue": "^3.2.47", "vue": "^3.2.47",
"vue-axios": "^3.5.2", "vue-axios": "^3.5.2",
"vue-router": "^4.1.6", "vue-router": "^4.1.6",
"vuex": "^4.1.0" "vuex": "^4.1.0",
"keycloak-js": "^21.0.2"
}, },
"devDependencies": { "devDependencies": {
"@babel/eslint-parser": "^7.21.3", "@babel/eslint-parser": "^7.21.3",
......
...@@ -4,6 +4,7 @@ import router from "./router"; ...@@ -4,6 +4,7 @@ import router from "./router";
import store from "@/store"; import store from "@/store";
import axios from "axios"; import axios from "axios";
import VueAxios from "vue-axios"; import VueAxios from "vue-axios";
import Keycloak from "keycloak-js";
import BootstrapVueNext from "bootstrap-vue-next"; import BootstrapVueNext from "bootstrap-vue-next";
import "bootstrap/dist/css/bootstrap.css"; import "bootstrap/dist/css/bootstrap.css";
...@@ -13,9 +14,42 @@ import { dom } from "@fortawesome/fontawesome-svg-core"; ...@@ -13,9 +14,42 @@ import { dom } from "@fortawesome/fontawesome-svg-core";
dom.watch(); dom.watch();
import "@fortawesome/fontawesome-free/css/all.css"; import "@fortawesome/fontawesome-free/css/all.css";
let initOptions = {
url: process.env.VUE_APP_KEYCLOAK_URL,
realm: 'medina',
clientId: 'cce-frontend',
onLoad: 'login-required'
}
let keycloak = new Keycloak(initOptions);
keycloak.init({onLoad: initOptions.onLoad}).then((auth) => {
if (!auth) {
window.location.reload();
} else {
axios.defaults.headers.common = {
'Authorization': 'Bearer ' + keycloak.token
};
const app = createApp(App); const app = createApp(App);
app.use(router); app.use(router);
app.use(store); app.use(store);
app.use(VueAxios, axios); app.use(VueAxios, axios);
app.use(BootstrapVueNext); app.use(BootstrapVueNext);
app.mount("#app"); app.mount("#app");
}
setInterval(() => {
keycloak.updateToken(300).then((refreshed) => {
if (!refreshed) {
console.warn('Token not refreshed, valid for '
+ Math.round(keycloak.tokenParsed.exp + keycloak.timeSkew - new Date().getTime() / 1000) + ' seconds');
}
}).catch(() => {
console.error('Failed to refresh token')
});
}, 300 * 1000)
}).catch(() => {
console.error("Keycloak authentication failed");
});
import api from "@/client/client"; import axios from "axios";
const headers = {
"Content-Type": "application/json"
};
export const ApiService = { export const ApiService = {
getToeList() { getToeList() {
return api.get("/toeList"); return axios.get(process.env.VUE_APP_API + "/toeList", {headers});
}, },
getToeHistory(toeId) { getToeHistory(toeId) {
return api.get("/toes/" + toeId + "/listHistory"); return axios.get(process.env.VUE_APP_API + "/toes/" + toeId + "/listHistory", {headers});
}, },
getTreeByStateId(stateId) { getTreeByStateId(stateId) {
return api.get("/history/" + stateId); return axios.get(process.env.VUE_APP_API + "/history/" + stateId, {headers});
}, },
}; };
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment