WIP

- Axios interceptor

fda-ui/components/DatabaseList.vue

@@ -51,7 +51,7 @@
 
 <script>
 import { formatCreators, formatUser, formatYearUTC, isResearcher } from '@/utils'
-import { listContainers, startContainer } from '@/api/container'
+import { startContainer } from '@/api/container'
 import { createDatabase } from '@/api/database'
 
 export default {
@@ -142,7 +142,7 @@ export default {
       this.createDbDialog = false
       try {
         this.loadingContainers = true
-        const res = await listContainers(this.limit)
+        const res = await this.$axios.get(`/api/container?limit=${this.limit}`)
         this.containers = res.data
         console.debug('containers', this.containers)
         this.error = false

fda-ui/nuxt.config.js

@@ -35,6 +35,8 @@ export default {
   ],
 
   plugins: [
+    { src: '@/plugins/axios', ssr: false },
+    { src: '@/plugins/keycloak', ssr: false },
     { src: '@/plugins/toast', ssr: false },
     { src: '@/plugins/vendors', ssr: false },
     { src: '@/plugins/axios', ssr: false },

fda-ui/package.json

@@ -37,6 +37,7 @@
     "is-docker": "^2.2.1",
     "jose": "^4.9.2",
     "jwt-decode": "^3.1.2",
+    "keycloak-js": "^21.0.2",
     "knex": "^0.95.6",
     "lodash": "^4.17.21",
     "moment": "^2.29.1",

fda-ui/plugins/axios.js

-export default function ({ $axios, redirect }) {
-  // TODO show a toast error when something goes wrong
-  // TODO console.log('axios intercepter args', arguments)
-}
+import Vue from 'vue'
+import axios from 'axios'
+import api from '../config'
+import updateToken from '../server-middleware/update-token'
 
-// export default function (item) {
-//   $axios.onError(error => {
-//     if(error.response.status === 500) {
-//       redirect('/sorry')
-//     }
-//   })
-// }
+const instance = axios.create({
+  baseURL: api,
+  timeout: 10000,
+  params: {}
+})
+
+instance.interceptors.request.use(async (config) => {
+  const token = await updateToken()
+  config.headers.common.Authorization = `Bearer ${token}`
+  return config
+}, function (error) {
+  // Do something with request error
+  return Promise.reject(error)
+})
+
+Vue.use(instance)

fda-ui/plugins/keycloak.js

+import Vue from 'vue'
+import Keycloak from 'keycloak-js'
+import api from '../config'
+
+const initOptions = {
+  url: api + '/api/auth',
+  realm: 'dbrepo',
+  clientId: 'dbrepo-client'
+}
+
+const _keycloak = new Keycloak(initOptions)
+
+const Plugin = {
+  install: (Vue) => {
+    Vue.$keycloak = _keycloak
+  }
+}
+Plugin.install = (Vue) => {
+  Vue.$keycloak = _keycloak
+  Object.defineProperties(Vue.prototype, {
+    $keycloak: {
+      get () {
+        return _keycloak
+      }
+    }
+  })
+}
+
+Vue.use(Plugin)
+
+export default Plugin

fda-ui/server-middleware/update-token.js

+import Vue from 'vue'
+
+export default async function () {
+  console.debug('loading token')
+  try {
+    await Vue.$keycloak.updateToken(70)
+    return String(Vue.$keycloak.token)
+  } catch (error) {
+    console.error('Failed to update token', error)
+  }
+}

fda-ui/yarn.lock

@@ -2928,7 +2928,7 @@ balanced-match@^1.0.0:
   resolved "https://registry.yarnpkg.com/balanced-match/-/balanced-match-1.0.2.tgz#e83e3a7e3f300b34cb9d87f615fa0cbf357690ee"
   integrity sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==
-base64-js@^1.0.2, base64-js@^1.3.1:
+base64-js@^1.0.2, base64-js@^1.3.1, base64-js@^1.5.1:
   version "1.5.1"
   resolved "https://registry.yarnpkg.com/base64-js/-/base64-js-1.5.1.tgz#1b1b440160a5bf7ad40b650f095963481903930a"
   integrity sha512-AKpaYlHn8t4SVbOHCy+b5+KKgvR4vrsD8vbvrbiQJps7fKDTkjkDry6ji0rUJjC0kzbNePLwzxq8iypo41qeWA==
@@ -7492,6 +7492,11 @@ js-cookie@^3.0.0:
   resolved "https://registry.yarnpkg.com/js-cookie/-/js-cookie-3.0.1.tgz#9e39b4c6c2f56563708d7d31f6f5f21873a92414"
   integrity sha512-+0rgsUXZu4ncpPxRL+lNEptWMOWl9etvPHc/koSRp6MPwpRYAhmk0dUG00J4bxVV3r9uUzfo24wW0knS07SKSw==
+js-sha256@^0.9.0:
+  version "0.9.0"
+  resolved "https://registry.yarnpkg.com/js-sha256/-/js-sha256-0.9.0.tgz#0b89ac166583e91ef9123644bd3c5334ce9d0966"
+  integrity sha512-sga3MHh9sgQN2+pJ9VYZ+1LPwXOxuBJBA5nrR5/ofPfuiJBE2hnjsaN8se8JznOmGLN2p49Pe5U/ttafcs/apA==
+
 js-string-escape@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/js-string-escape/-/js-string-escape-1.0.1.tgz#e2625badbc0d67c7533e9edc1068c587ae4137ef"
@@ -7631,6 +7636,14 @@ jwt-decode@^3.1.2:
   resolved "https://registry.yarnpkg.com/jwt-decode/-/jwt-decode-3.1.2.tgz#3fb319f3675a2df0c2895c8f5e9fa4b67b04ed59"
   integrity sha512-UfpWE/VZn0iP50d8cz9NrZLM9lSWhcJ+0Gt/nm4by88UL+J1SiKN8/5dkjMmbEzwL2CAe+67GsegCbIKtbp75A==
+keycloak-js@^21.0.2:
+  version "21.0.2"
+  resolved "https://registry.yarnpkg.com/keycloak-js/-/keycloak-js-21.0.2.tgz#1d3c2079d3c23850df4f253a868926861c51c488"
+  integrity sha512-i05i3VBPhQ867EgjA+OYPlf8YUPiUwtrU2zv4j8tvZIdRvhJY8f+mp1ZvRJl/GMRb+XhJs9BDknyBMrIspwDkw==
+  dependencies:
+    base64-js "^1.5.1"
+    js-sha256 "^0.9.0"
+
 keyv@^3.0.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/keyv/-/keyv-3.1.0.tgz#ecc228486f69991e49e9476485a5be1e8fc5c4d9"