renew jwt

package-lock.json

@@ -3529,6 +3529,11 @@
       "integrity": "sha1-LHS27kHZPKUbe1qu6PUDYx0lKnM=",
       "dev": true
     },
+    "jwt-decode": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/jwt-decode/-/jwt-decode-2.2.0.tgz",
+      "integrity": "sha1-fYa9VmefWM5qhHBKZX3TkruoGnk="
+    },
     "kind-of": {
       "version": "3.2.2",
       "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",

package.json

@@ -32,6 +32,7 @@
     "axios": "^0.16.2",
     "babel-polyfill": "^6.26.0",
     "intersection-observer": "^0.4.0",
+    "jwt-decode": "^2.2.0",
     "vue": "^2.4.2",
     "vue-observe-visibility": "^0.1.3",
     "vue-router": "^2.7.0",

src/components/forms/login.vue

@@ -26,6 +26,7 @@ export default {
             .then(user => {
                 console.log("---- user login --------");
                 console.log(user);
+                this.$router.go(-1);
             })
             .catch(error => {
                 console.log("---- login error -------");

src/main.js

@@ -2,6 +2,7 @@ import Vue from 'vue';
 import Vuex from 'vuex';
 import VueRouter from 'vue-router';
 import Axios from 'axios';
+import JwtDecode from 'jwt-decode';
 
 import App from './app.vue';
 import Dashboard from './components/dashboard.vue';
@@ -11,12 +12,33 @@ import Userlist from './components/userlist.vue';
 Vue.use(VueRouter);
 Vue.use(Vuex);
 
+
+const routes = [
+  {
+    path: '/login',
+    component: LoginForm
+  },
+  {
+    path: '/',
+    component: Dashboard
+  },
+  {
+    path: '/userlist',
+    component: Userlist
+  }
+];
+
+const router = new VueRouter({
+  routes
+});
+
 const store = new Vuex.Store({
   state: {
     api: {},
     navigation: [],
     login: {},
     authToken: '',
+    jwt: {},
     credentials: {}
   },
   mutations: {
@@ -37,34 +59,79 @@ const store = new Vuex.Store({
     setLogin(state, payload) {
       state.login = payload.User;
       state.authToken = payload.AuthToken;
+      state.jwt = JwtDecode(payload.AuthToken);
+    },
+    clearLogin() {
+      state.login = {};
+      state.authToken = '';
+      state.jwt = {};
     }
   },
   actions: {
     apiRequest(context, payload) {
-      return new Promise((resolve, reject) => {
+      let doRequest = () => {
+        return new Promise((resolve, reject) => {
+          Axios({
+            method: payload.method ? payload.method : 'get',
+            baseURL: context.state.api.baseURL,
+            url: payload.endpoint,
+            params: payload.params,
+            data: payload.data,
+            headers: {
+              'X-Auth-Token': context.state.authToken
+            }
+          })
+            .then(response => {
+                console.log(response);
+                resolve(response.data);
+            })
+            .catch(error => {
+                console.dir(error);
+                reject(error);
+            })
+        });
+      };
+
+      if (payload.endpoint != 'login') {
+        // no jwt check for login call
         
-        Axios({
-          method: payload.method ? payload.method : 'get',
-          baseURL: context.state.api.baseURL,
-          url: payload.endpoint,
-          params: payload.params,
-          data: payload.data,
-          headers: {
-            'X-Auth-Token': context.state.authToken
-          }
-        })
-          .then(response => {
-              console.log(response);
-              resolve(response.data);
-          })
-          .catch(error => {
-              console.dir(error);
-              reject(error);
-          })
-      });
+        // empty username = not logged in
+        if (!context.state.credentials.username) {
+          return new Promise((resolve, reject) => {
+            // show login page
+            router.push('/login');
+            reject(['not logged in']);
+          });
+        }
+
+        let now = Math.round(Date.now() / 1000);
+        if ( context.state.jwt.exp < (now + 300) ) {
+          // too old jwt, logout
+          return new Promise((resolve, reject) => {
+            context.commit('clearLogin');
+            router.push('/login');
+            reject(['jwt too old, logout']);
+          });
+        }
+
+        if ( (context.state.jwt.exp - 60) < now ) {
+          // jwt near expire, get new one
+          console.log("getting new jwt");
+
+          return context.dispatch('login', context.state.credentials)
+            .then(() => {
+              console.log("LOOOGIIIINNN");
+              return doRequest();
+            })
+            .catch(error => {
+              throw error;
+            })
+        }
+      }
+
+      return doRequest();
     },
     login(context, payload) {
-      context.commit('setCredentials', payload);
       return new Promise((resolve, reject) => {
         context.dispatch('apiRequest', {
           method: 'post',
@@ -72,6 +139,7 @@ const store = new Vuex.Store({
           data: payload
         })
           .then(data => {
+            context.commit('setCredentials', payload);
             context.commit('setLogin', data);
             resolve(data.User);
           })
@@ -87,26 +155,6 @@ const store = new Vuex.Store({
   }
 });
 
-
-const routes = [
-  {
-    path: '/login',
-    component: LoginForm
-  },
-  {
-    path: '/',
-    component: Dashboard
-  },
-  {
-    path: '/userlist',
-    component: Userlist
-  }
-];
-
-const router = new VueRouter({
-  routes
-});
-
 // load init
 Axios.get('conf/init.json')
     .then(results => {