Authorization Bearer in Header

frontend/src/main.js

@@ -3,7 +3,7 @@ import DashboardPlugin from './plugins/dashboard-plugin'
 import App from './App.vue'
 import i18n from './i18n.js'
 import { loadAllRules } from './validation-rules'
-import ApolloClient from 'apollo-boost'
+import { ApolloClient, ApolloLink, InMemoryCache, HttpLink } from 'apollo-boost'
 import VueApollo from 'vue-apollo'
 import CONFIG from './config'
 
@@ -11,7 +11,21 @@ import { store } from './store/store'
 
 import router from './routes/router'
 
+const httpLink = new HttpLink({ uri: CONFIG.GRAPHQL_URI })
+
+const authLink = new ApolloLink((operation, forward) => {
+  const token = store.state.token
+  operation.setContext({
+    headers: {
+      Authorization: token && token.length > 0 ? `Bearer ${token}` : '',
+    },
+  })
+  return forward(operation)
+})
+
 const apolloClient = new ApolloClient({
+  link: authLink.concat(httpLink),
+  cache: new InMemoryCache(),
   uri: CONFIG.GRAPHQL_URI,
 })
 

frontend/src/store/store.js

@@ -51,14 +51,15 @@ export const actions = {
     commit('firstName', '')
     commit('lastName', '')
     commit('description', '')
-    sessionStorage.clear()
+    commit('token', null)
+    localStorage.clear()
   },
 }
 
 export const store = new Vuex.Store({
   plugins: [
     createPersistedState({
-      storage: window.sessionStorage,
+      storage: window.localStorage,
     }),
   ],
   state: {
@@ -69,6 +70,7 @@ export const store = new Vuex.Store({
     lastName: '',
     username: '',
     description: '',
+    token: null,
   },
   getters: {},
   // Syncronous mutation of the state

frontend/src/views/Layout/DashboardLayout_gdd.vue

@@ -107,7 +107,6 @@ export default {
     },
     async updateTransactions(pagination) {
       this.pending = true
-      console.log('Session ID', this.$store.state.sessionId)
       this.$apollo
         .query({
           query: transactionsQuery,
@@ -119,11 +118,9 @@ export default {
           fetchPolicy: 'network-only',
         })
         .then((result) => {
-          console.log(result)
           const {
             data: { transactionList },
           } = result
-          console.log(transactionList)
           this.GdtBalance = Number(transactionList.gdtSum)
           this.transactions = transactionList.transactions
           this.balance = Number(transactionList.decay)