:bug: Fixing a bug. fix #22 #21

src/api/login.js

@@ -15,13 +15,15 @@
  * Author: lengleng (wangiegie@gmail.com)
  */
 import request from '@/router/axios'
+const scope = 'server'
 
 export const loginByUsername = (username, password, code, randomStr) => {
-  var grant_type = 'password'
-  var scope = 'server'
+  const grant_type = 'password'
+
   return request({
     url: '/auth/oauth/token',
     headers: {
+      isToken:false,
       'TENANT_ID': '1',
       'Authorization': 'Basic cGlnOnBpZw=='
     },
@@ -30,8 +32,22 @@ export const loginByUsername = (username, password, code, randomStr) => {
   })
 }
 
+export const refeshToken = (refresh_token) => {
+  const grant_type = 'refresh_token'
+  return request({
+    url: '/auth/oauth/token',
+    headers: {
+      'isToken': false,
+      'TENANT_ID': '1',
+      'Authorization': 'Basic cGlnOnBpZw==',
+    },
+    method: 'post',
+    params: { refresh_token, grant_type, scope }
+  })
+}
+
 export const loginByMobile = (mobile, code) => {
-  var grant_type = 'mobile'
+  const grant_type = 'mobile'
   return request({
     url: '/auth/mobile/token/sms',
     headers: {
@@ -44,7 +60,7 @@ export const loginByMobile = (mobile, code) => {
 }
 
 export const loginBySocial = (state, code) => {
-  var grant_type = 'mobile'
+  const grant_type = 'mobile'
   return request({
     url: '/auth/mobile/token/social',
     headers: {

src/const/errorCode.js

@@ -5,6 +5,8 @@ export default {
   '404': '资源不存在',
   '417': '未绑定登录账号，请使用密码登录后绑定',
   '423': '演示环境不能操作，如需了解联系冷冷',
+  '426': '用户名不存在或密码错误',
+  '428': '验证码错误,请重新输入',
   '429': '请求过频繁',
   '479': '演示环境，没有权限操作',
   'default': '系统未知错误,请反馈给管理员'

src/const/website.js

@@ -16,6 +16,7 @@ export default {
       '当前版本：v2.0.0'
     ]
   },
+  statusWhiteList: [428],
   // http的status默认放行不才用统一处理的,
   // 配置首页不可关闭
   isFirstPage: false,

src/page/index/index.vue

@@ -3,25 +3,25 @@
        :class="{'avue--collapse':isCollapse}">
     <div class="avue-header">
       <!-- 顶部导航栏 -->
-      <top />
+      <top/>
     </div>
 
     <div class="avue-layout">
       <div class="avue-left">
         <!-- 左侧导航栏 -->
-        <sidebar />
+        <sidebar/>
       </div>
       <div class="avue-main">
         <!-- 顶部标签卡 -->
-        <tags />
+        <tags/>
         <!-- 主体视图层 -->
         <el-scrollbar style="height:100%">
           <keep-alive>
             <router-view class="avue-view"
-                         v-if="$route.meta.$keepAlive" />
+                         v-if="$route.meta.$keepAlive"/>
           </keep-alive>
           <router-view class="avue-view"
-                       v-if="!$route.meta.$keepAlive" />
+                       v-if="!$route.meta.$keepAlive"/>
         </el-scrollbar>
 
       </div>
@@ -38,73 +38,82 @@
 </template>
 
 <script>
-import { mapGetters } from 'vuex'
-import tags from './tags'
-import top from './top/'
-import sidebar from './sidebar/'
-import admin from '@/util/admin';
-import { validatenull } from '@/util/validate';
-import { calcDate } from '@/util/date.js';
-import { getStore } from '@/util/store.js';
-export default {
-  components: {
-    top,
-    tags,
-    sidebar
-  },
-  name: 'index',
-  data () {
-    return {
-      //刷新token锁
-      refreshLock: false,
-      //刷新token的时间
-      refreshTime: '',
-    }
-  },
-  created () {
-    //实时检测刷新token
-    // this.refreshToken();
-  },
-  mounted () {
-    this.init();
-  },
-  computed: mapGetters(['isLock', 'isCollapse', 'website']),
-  props: [],
-  methods: {
-    showCollapse () {
-      this.$store.commit("SET_COLLAPSE");
+  import {mapGetters} from 'vuex'
+  import tags from './tags'
+  import top from './top/'
+  import sidebar from './sidebar/'
+  import admin from '@/util/admin';
+  import {validatenull} from '@/util/validate';
+  import {calcDate} from '@/util/date.js';
+  import {getStore} from '@/util/store.js';
+
+  export default {
+    components: {
+      top,
+      tags,
+      sidebar
     },
-    // 屏幕检测
-    init () {
-      this.$store.commit('SET_SCREEN', admin.getScreen());
-      window.onresize = () => {
-        setTimeout(() => {
-          this.$store.commit('SET_SCREEN', admin.getScreen());
-        }, 0);
+    name: 'index',
+    data() {
+      return {
+        //刷新token锁
+        refreshLock: false,
+        //刷新token的时间
+        refreshTime: '',
       }
     },
-    // 实时检测刷新token
-    refreshToken () {
-      this.refreshTime = setInterval(() => {
-        const token = getStore({
-          name: 'token',
-          debug: true,
-        });
-        const date = calcDate(token.datetime, new Date().getTime());
-        if (validatenull(date)) return;
-        if (!(date.seconds >= this.website.tokenTime) && !this.refreshLock) {
-          this.refreshLock = true;
-          this.$store
-            .dispatch('RefeshToken')
-            .then(() => {
-              clearInterval(this.refreshTime);
-            })
-            .catch(() => {
-              this.refreshLock = false;
-            });
-        }
-      }, 3000);
+    created() {
+      //实时检测刷新token
+      this.refreshToken()
+    },
+    destroyed() {
+      console.log("销毁")
+      console.log(this.refreshTime)
+      clearInterval(this.refreshTime)
+    },
+    mounted() {
+      this.init()
     },
+    computed: mapGetters(['isLock', 'isCollapse', 'website', 'expires_in']),
+    props: [],
+    methods: {
+      showCollapse() {
+        this.$store.commit("SET_COLLAPSE")
+      },
+      // 屏幕检测
+      init() {
+        this.$store.commit('SET_SCREEN', admin.getScreen())
+        window.onresize = () => {
+          setTimeout(() => {
+            this.$store.commit('SET_SCREEN', admin.getScreen())
+          }, 0);
+        }
+      },
+      // 实时检测刷新token
+      refreshToken() {
+        this.refreshTime = setInterval(() => {
+          const token = getStore({
+            name: 'access_token',
+            debug: true,
+          });
+
+          console.log(this.expires_in)
+          if (validatenull(token)) {
+            return;
+          }
+
+          if (this.expires_in <= 1000 && !this.refreshLock) {
+            this.refreshLock = true
+            this.$store
+              .dispatch('RefeshToken')
+              .catch(() => {
+                clearInterval(this.refreshTime)
+              });
+            this.refreshLock = false
+          }
+          this.$store.commit("SET_EXPIRES_IN",this.expires_in - 10);
+        }, 10000);
+      },
+    }
   }
-}
-</script>
+</script>

src/page/login/codelogin.vue

@@ -92,7 +92,6 @@ export default {
               url: '/admin/mobile/' + this.loginForm.mobile,
               method: 'get'
           }).then(response => {
-              console.log(response.data.data)
               if (response.data.data) {
                   this.$message.success('验证码发送成功')
               } else {

src/page/login/userlogin.vue

@@ -158,10 +158,10 @@ export default {
         if (valid) {
           this.$store.dispatch("LoginByUsername", this.loginForm).then(() => {
             this.$router.push({ path: this.tagWel.value });
-          }),
-            () => {
-              this.refreshCode()
-            }
+          }).catch(()=>{
+            this.refreshCode()
+          })
+
         }
       });
     }

src/router/axios.js

@@ -1,12 +1,4 @@
-/**
- * 全站http配置
- *
- * header参数说明
- * serialize是否开启form表单提交
- * isToken是否需要token
- */
 import {serialize} from '@/util/util'
-import website from '@/const/website'
 import store from '../store'
 import {getStore} from '../util/store'
 import {getToken} from '@/util/auth'
@@ -26,14 +18,15 @@ axios.defaults.withCredentials = true
 NProgress.configure({
   showSpinner: false
 })
+
 // HTTPrequest拦截
 axios.interceptors.request.use(config => {
   NProgress.start() // start progress bar
-  const isToken = (config.data || {}).isToken === false
+  const TENANT_ID = getStore({name: 'tenantId'})
+  const isToken = (config.headers || {}).isToken === false
   if (store.getters.access_token && !isToken) {
-    config.headers['Authorization'] = 'Bearer ' + getToken() // 让每个请求携带token--['X-Token']为自定义key 请根据实际情况自行修改
+    config.headers['Authorization'] = 'Bearer ' + getToken()// token
   }
-  const TENANT_ID = getStore({name: 'tenantId'})
   if (TENANT_ID) {
     config.headers['TENANT_ID'] = TENANT_ID // 租户ID
   }
@@ -46,29 +39,21 @@ axios.interceptors.request.use(config => {
 }, error => {
   return Promise.reject(error)
 })
+
+
 // HTTPresponse拦截
 axios.interceptors.response.use(res => {
   NProgress.done()
   const status = Number(res.status) || 200
   const message = res.data.msg || errorCode[status] || errorCode['default']
-  if (res.data.code === 1) {
-    Message({
-      message: message,
-      type: 'error'
-    })
-    return Promise.reject(new Error(message))
-  }
-
   if (status === 401) {
     store.dispatch('FedLogOut').then(() => {
-      router.push({
-        path: '/login'
-      })
+      router.push({path: '/login'})
     })
     return
   }
 
-  if (status !== 200) {
+  if (status !== 200 || res.data.code === 1) {
     Message({
       message: message,
       type: 'error'

src/store/getters.js

@@ -15,6 +15,7 @@ const getters = {
   tagWel: state => state.tags.tagWel,
   access_token: state => state.user.access_token,
   refresh_token: state => state.user.refresh_token,
+  expires_in: state => state.user.expires_in,
   roles: state => state.user.roles,
   permissions: state => state.user.permissions,
   menu: state => state.user.menu,

src/store/modules/user.js

@@ -1,12 +1,12 @@
-import { removeToken, setToken } from '@/util/auth'
-import { getStore, setStore } from '@/util/store'
-import { isURL } from '@/util/validate'
-import { getUserInfo, loginByMobile, loginBySocial, loginByUsername, logout } from '@/api/login'
-import { deepClone, encryption } from '@/util/util'
+import {removeToken, setToken} from '@/util/auth'
+import {getStore, setStore} from '@/util/store'
+import {isURL} from '@/util/validate'
+import {getUserInfo, loginByMobile, loginBySocial, loginByUsername, logout, refeshToken} from '@/api/login'
+import {deepClone, encryption} from '@/util/util'
 import webiste from '@/const/website'
-import { GetMenu } from '@/api/admin/menu'
+import {GetMenu} from '@/api/admin/menu'
 
-function addPath (ele, first) {
+function addPath(ele, first) {
   const propsConfig = webiste.menu.props
   const propsDefault = {
     label: propsConfig.label || 'label',
@@ -36,6 +36,9 @@ const user = {
       name: 'menu'
     }) || [],
     menuAll: [],
+    expires_in: getStore({
+      name: 'expires_in'
+    }) || '',
     access_token: getStore({
       name: 'access_token'
     }) || '',
@@ -45,7 +48,7 @@ const user = {
   },
   actions: {
     // 根据用户名登录
-    LoginByUsername ({ commit }, userInfo) {
+    LoginByUsername({commit}, userInfo) {
       const user = encryption({
         data: userInfo,
         key: 'pigxpigxpigxpigx',
@@ -57,6 +60,7 @@ const user = {
           setToken(data.access_token)
           commit('SET_ACCESS_TOKEN', data.access_token)
           commit('SET_REFRESH_TOKEN', data.refresh_token)
+          commit('SET_EXPIRES_IN', data.expires_in)
           commit('CLEAR_LOCK')
           resolve()
         }).catch(error => {
@@ -65,13 +69,14 @@ const user = {
       })
     },
     // 根据手机号登录
-    LoginByPhone ({ commit }, userInfo) {
+    LoginByPhone({commit}, userInfo) {
       return new Promise((resolve, reject) => {
         loginByMobile(userInfo.mobile, userInfo.code).then(response => {
           const data = response.data
           setToken(data.access_token)
           commit('SET_ACCESS_TOKEN', data.access_token)
           commit('SET_REFRESH_TOKEN', data.refresh_token)
+          commit('SET_EXPIRES_IN', data.expires_in)
           commit('CLEAR_LOCK')
           resolve()
         }).catch(error => {
@@ -80,13 +85,14 @@ const user = {
       })
     },
     // 根据OpenId登录
-    LoginBySocial ({ commit }, param) {
+    LoginBySocial({commit}, param) {
       return new Promise((resolve, reject) => {
         loginBySocial(param.state, param.code).then(response => {
           const data = response.data
           setToken(data.access_token)
           commit('SET_ACCESS_TOKEN', data.access_token)
           commit('SET_REFRESH_TOKEN', data.refresh_token)
+          commit('SET_EXPIRES_IN', data.expires_in)
           commit('CLEAR_LOCK')
           resolve()
         }).catch(error => {
@@ -94,7 +100,7 @@ const user = {
         })
       })
     },
-    GetUserInfo ({ commit }) {
+    GetUserInfo({commit}) {
       return new Promise((resolve, reject) => {
         getUserInfo().then((res) => {
           const data = res.data.data || {}
@@ -108,11 +114,15 @@ const user = {
       })
     },
     // 刷新token
-    RefeshToken ({ commit }) {
+    RefeshToken({commit, state}) {
       return new Promise((resolve, reject) => {
-        logout().then(() => {
-          commit('SET_TOKEN', new Date().getTime())
-          setToken()
+        refeshToken(state.refresh_token).then(response => {
+          const data = response.data
+          setToken(data.access_token)
+          commit('SET_ACCESS_TOKEN', data.access_token)
+          commit('SET_REFRESH_TOKEN', data.refresh_token)
+          commit('SET_EXPIRES_IN', data.expires_in)
+          commit('CLEAR_LOCK')
           resolve()
         }).catch(error => {
           reject(error)
@@ -120,7 +130,7 @@ const user = {
       })
     },
     // 登出
-    LogOut ({ commit }) {
+    LogOut({commit}) {
       return new Promise((resolve, reject) => {
         logout().then(() => {
           commit('SET_MENU', [])
@@ -128,6 +138,7 @@ const user = {
           commit('SET_USER_INFO', {})
           commit('SET_ACCESS_TOKEN', '')
           commit('SET_REFRESH_TOKEN', '')
+          commit('SET_EXPIRES_IN', '')
           commit('SET_ROLES', [])
           commit('DEL_ALL_TAG')
           commit('CLEAR_LOCK')
@@ -139,7 +150,7 @@ const user = {
       })
     },
     // 注销session
-    FedLogOut ({ commit }) {
+    FedLogOut({commit}) {
       return new Promise(resolve => {
         commit('SET_MENU', [])
         commit('SET_PERMISSIONS', [])
@@ -154,9 +165,9 @@ const user = {
       })
     },
     // 获取系统菜单
-    GetMenu ({
-      commit
-    }) {
+    GetMenu({
+              commit
+            }) {
       return new Promise(resolve => {
         GetMenu().then((res) => {
           const data = res.data.data
@@ -180,6 +191,14 @@ const user = {
         type: 'session'
       })
     },
+    SET_EXPIRES_IN: (state, expires_in) => {
+      state.expires_in = expires_in
+      setStore({
+        name: 'expires_in',
+        content: state.expires_in,
+        type: 'session'
+      })
+    },
     SET_REFRESH_TOKEN: (state, rfToken) => {
       state.refresh_token = rfToken
       setStore({