From 972627c32d0f867bd214eb1b1563fe09e80e570d Mon Sep 17 00:00:00 2001
From: xhong <xhong_17@outlook.com>
Date: Mon, 18 Jul 2022 16:16:21 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E9=80=9A=E8=BF=87=E9=99=90=E5=88=B6Tok?=
 =?UTF-8?q?en=E6=97=B6=E9=97=B4=E5=AE=9E=E7=8E=B0=E7=94=A8=E6=88=B7?=
 =?UTF-8?q?=E8=A2=AB=E5=8A=A8=E9=80=80=E5=87=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/request.js       | 12 ++++++++++++
 src/store/modules/app.js |  8 ++++++++
 src/utils/auth.js        | 18 ++++++++++++++++++
 src/utils/constant.js    |  5 +++++
 4 files changed, 43 insertions(+)
 create mode 100644 src/utils/auth.js
 create mode 100644 src/utils/constant.js

diff --git a/src/api/request.js b/src/api/request.js
index e086e5d..f3f4ff4 100644
--- a/src/api/request.js
+++ b/src/api/request.js
@@ -2,6 +2,11 @@
 import axios from 'axios'
 // 引入 ElMessage 消息提示
 import { ElMessage } from 'element-plus'
+// 导入比较 Token 时间的方法
+import { diffTokenTime } from '@/utils/auth'
+
+import store from '@/store'
+
 // axios 基础配置
 const service = axios.create({
   // 基础路径
@@ -35,6 +40,13 @@ service.interceptors.response.use(
 // 请求拦截器
 service.interceptors.request.use(
   (config) => {
+    if (localStorage.getItem('token')) {
+      if (diffTokenTime()) {
+        // 通过 vuex 实现退出操作
+        store.dispatch('app/logout')
+        return Promise.reject(new Error('token 失效了'))
+      }
+    }
     config.headers.Authorization = localStorage.getItem('token')
     return config
   },
diff --git a/src/store/modules/app.js b/src/store/modules/app.js
index a10371e..1039f7e 100644
--- a/src/store/modules/app.js
+++ b/src/store/modules/app.js
@@ -1,5 +1,6 @@
 import { login as loginApi } from '@/api/login'
 import router from '@/router'
+import { setTokenTime } from '@/utils/auth'
 
 export default {
   namespaced: true,
@@ -17,6 +18,7 @@ export default {
           .then((res) => {
             console.log(res)
             commit('setToken', res.token)
+            setTokenTime()
             router.replace('/menu')
             resolve()
           })
@@ -24,6 +26,12 @@ export default {
             reject(err)
           })
       })
+    },
+    // Token 超时退出到登录界面
+    logout({ commit }) {
+      commit('setToken', '')
+      localStorage.clear()
+      router.replace('/login')
     }
   }
 }
diff --git a/src/utils/auth.js b/src/utils/auth.js
new file mode 100644
index 0000000..c95fdb2
--- /dev/null
+++ b/src/utils/auth.js
@@ -0,0 +1,18 @@
+import { TOKEN_TIME, TOKEN_TIME_VALUE } from './constant'
+
+// 登录时开始 Token 时间
+export const setTokenTime = () => {
+  localStorage.setItem(TOKEN_TIME, Date.now())
+}
+
+// 获取 Token 时间
+export const getTokenTime = () => {
+  return localStorage.getItem(TOKEN_TIME)
+}
+
+//  比较 Token 是否已经过期
+export const diffTokenTime = () => {
+  const currentTime = Date.now()
+  const tokenTime = getTokenTime()
+  return currentTime - tokenTime > TOKEN_TIME_VALUE
+}
diff --git a/src/utils/constant.js b/src/utils/constant.js
new file mode 100644
index 0000000..356fabb
--- /dev/null
+++ b/src/utils/constant.js
@@ -0,0 +1,5 @@
+export const TOKEN_TIME = 'tokenTime'
+// TOKEN 有效期时间 - 1h
+export const TOKEN_TIME_VALUE = 1 * 60 * 60 * 1000
+// TOKEN 有效期时间 - 6s
+// export const TOKEN_TIME_VALUE = 6 * 1000