fixed: login maxcall

src/permission.js

@@ -4,7 +4,6 @@ import store from './store'
 
 import NProgress from 'nprogress' // progress bar
 import 'nprogress/nprogress.css' // progress bar style
-// import { Message } from 'ant-design-vue'
 
 import { getToken } from "./utils/auth"
 
@@ -22,18 +21,15 @@ router.beforeEach((to, from, next) => {
       NProgress.done()
     } else {
       if (store.getters.roles.length === 0) {
-
         store.dispatch('GetInfo').then(res => {
           const roles = res.result && res.result.role
           store.dispatch('GenerateRoutes', { roles }).then(() => { // 根据roles权限生成可访问的路由表
-
             router.addRoutes(store.getters.addRouters) // 动态添加可访问路由表
             next({ ...to, replace: true }) // hack方法 确保addRoutes已完成 ,set the replace: true so the navigation will not leave a history record
           })
-        }).catch((err) => {
-          store.dispatch('FedLogout').then(() => {
-            Vue.$message.error('This is a message of error');
-            Vue.$message.error(err.message)
+        }).catch(() => {
+          store.dispatch('Logout').then(() => {
+            next({ path: '/login' })
           })
         })
 

src/store/modules/user.js

@@ -80,26 +80,19 @@ const user = {
 
     // 登出
     Logout({ commit, state }) {
-      return new Promise((resolve, reject) => {
+      return new Promise((resolve) => {
+        commit('SET_TOKEN', '')
+        commit('SET_ROLES', [])
+        removeToken()
+
         logout(state.token).then(() => {
-          commit('SET_TOKEN', '')
-          commit('SET_ROLES', [])
-          removeToken()
           resolve()
-        }).catch(error => {
-          reject(error)
+        }).catch(() => {
+          resolve()
         })
       })
     },
 
-    // 前端 登出
-    FedLogout({ commit }) {
-      return new Promise(resolve => {
-        commit('SET_TOKEN', '')
-        removeToken()
-        resolve()
-      })
-    }
   }
 }
 

src/utils/auth.js

-import Cookies from 'js-cookie'
+import { setStore, getStore, clearStore } from "@/utils/storage";
 
 export const TokenKey = 'Access-Token'
 
 export function getToken() {
-  return Cookies.get(TokenKey)
+  return getStore(TokenKey)
 }
 
 export function setToken(token) {
-  return Cookies.set(TokenKey, token)
+  // key, token, timeout = 86400s
+  return setStore(TokenKey, token, 86400)
 }
 
 export function removeToken() {
-  return Cookies.remove(TokenKey)
+  return clearStore(TokenKey)
 }
\ No newline at end of file

src/utils/request.js

 import axios from 'axios'
 import store from '../store'
 import { VueAxios } from './axios'
+import notification from 'ant-design-vue/es/notification'
+
 
 // 创建 axios 实例
 const service = axios.create({
-    baseURL: '/api', // api base_url
-    timeout: 5000 // 请求超时时间
+  baseURL: '/api', // api base_url
+  timeout: 5000 // 请求超时时间
 })
 
+const err = (error) => {
+  if (error.response) {
+    if (error.status === 403) {
+      notification.error({ message: '拒绝访问', description: '无权限，拒绝访问' })
+    }
+    if (error.status === 401) {
+      notification.error({ message: '未授权', description: '授权验证失败' })
+      store.dispatch('Logout').then(() => {
+        location.reload()
+      })
+    }
+  }
+  return Promise.reject(error)
+};
+
 // request 拦截器
 service.interceptors.request.use(config => {
-    if (store.getters.token) {
-        config.headers['Access-Token'] = '' // 让每个请求携带自定义 token 请根据实际情况自行修改
-    }
-    return config
-}, error => {
-    // Do something with request error
-    Promise.reject(error)
-})
+  if (store.getters.token) {
+    config.headers[ 'Access-Token' ] = store.getters.token // 让每个请求携带自定义 token 请根据实际情况自行修改
+  }
+  return config
+}, err)
 
-// respone拦截器
-service.interceptors.response.use(
-    (response) => {
-        const res = response.data
-        //console.log('[LOG] -> respoinse.use', res)
-        if (res.status !== 200) {
-            return Promise.reject('error')
-        } else {
-            return response.data
-        }
-    },
-    (error) => {
-        if (error.response && error.response.data) {
-            const result = error.response.data
-            return Promise.reject(result)
-        }
-        return Promise.reject(error)
-    }
-)
+// response 拦截器
+service.interceptors.response.use((response) => {
+    return response.data
+  }, err)
 
 const installer = {
-    vm: {},
-    install(Vue, router = {}) {
-        Vue.use(VueAxios, router, service)
-    }
+  vm: {},
+  install (Vue, router = {}) {
+    Vue.use(VueAxios, router, service)
+  }
 }
 
 export {
-    installer as VueAxios,
-    service as axios
+  installer as VueAxios,
+  service as axios
 }
\ No newline at end of file

src/utils/storage.js

+/**
+ * Set storage
+ *
+ * @param name
+ * @param content
+ * @param maxAge
+ */
+export const setStore = (name, content, maxAge = null) => {
+  if (!global.window || !name) {
+    return;
+  }
+
+  if (typeof content !== 'string') {
+    content = JSON.stringify(content)
+  }
+
+  let storage = global.window.localStorage
+
+  storage.setItem(name, content)
+  if (maxAge && !isNaN(parseInt(maxAge))) {
+    let timeout = parseInt(new Date().getTime() / 1000)
+    storage.setItem(`${name}_expire`, timeout + maxAge)
+  }
+};
+
+/**
+ * Get storage
+ *
+ * @param name
+ * @returns {*}
+ */
+export const getStore = name => {
+  if (!global.window || !name) {
+    return;
+  }
+
+  let content = window.localStorage.getItem(name)
+  let _expire = window.localStorage.getItem(`${name}_expire`)
+
+  if (_expire) {
+    let now = parseInt(new Date().getTime() / 1000)
+    if (now > _expire) {
+      return;
+    }
+  }
+
+  try {
+    return JSON.parse(content)
+  } catch (e) {
+    return content
+  }
+};
+
+/**
+ * Clear storage
+ *
+ * @param name
+ */
+export const clearStore = name => {
+  if (!global.window || !name) {
+    return;
+  }
+
+  window.localStorage.removeItem(name)
+  window.localStorage.removeItem(`${name}_expire`)
+};
+
+/**
+ * Clear all storage
+ */
+export const clearAll = () => {
+  if (!global.window || !name) {
+    return;
+  }
+
+  window.localStorage.clear()
+}
+

src/views/Login.vue

@@ -56,8 +56,11 @@
                 </a-col>
                 <a-col class="gutter-row" :span="8">
                     <span class="ivu-input-prefix">
-                      <a-button class="getCaptcha" :disabled="state.smsSendBtn"
-                                @click.stop.prevent="getCaptcha" v-text="!state.smsSendBtn&&'获取验证码'||(state.time+' s')"></a-button>
+                      <a-button 
+class="getCaptcha" 
+:disabled="state.smsSendBtn"
+                                @click.stop.prevent="getCaptcha" 
+v-text="!state.smsSendBtn&&'获取验证码'||(state.time+' s')"></a-button>
                     </span>
                 </a-col>
               </a-row>
@@ -71,9 +74,14 @@
           </a-form-item>
 
           <a-form-item style="margin-top:24px">
-            <a-button size="large" type="primary"
-                      htmlType="submit" class="login-button" :loading="loginBtn"
-                      @click.stop.prevent="handleSubmit" v-bind:disabled="loginBtn" >确定</a-button>
+            <a-button 
+size="large" 
+type="primary"
+                      htmlType="submit" 
+class="login-button" 
+:loading="loginBtn"
+                      @click.stop.prevent="handleSubmit" 
+v-bind:disabled="loginBtn" >确定</a-button>
           </a-form-item>
 
         </a-form>