From a8ab61169495ead066f6a02321d7895e49139a5e Mon Sep 17 00:00:00 2001
From: Cool <747682928@qq.com>
Date: Thu, 4 Jul 2024 17:41:31 +0800
Subject: [PATCH] =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E7=99=BB=E5=BD=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
package-lock.json | 17 ++++-
package.json | 3 +-
src/main.js | 3 +-
src/router/index.js | 5 +-
src/router/permission.js | 22 ++++++
src/store/index.js | 26 +++++++
src/store/request.js | 55 ++++++++++++++
src/views/Login.vue | 158 ++++++++++++++++++++-------------------
src/views/User.vue | 6 +-
9 files changed, 211 insertions(+), 84 deletions(-)
create mode 100644 src/router/permission.js
create mode 100644 src/store/index.js
create mode 100644 src/store/request.js
diff --git a/package-lock.json b/package-lock.json
index 45f8104..26ab0ac 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -14,7 +14,8 @@
"element-ui": "^2.15.14",
"less-loader": "^12.2.0",
"vue": "^2.6.14",
- "vue-router": "^2.8.1"
+ "vue-router": "^2.8.1",
+ "vuex": "^3.6.2"
},
"devDependencies": {
"@babel/core": "^7.12.16",
@@ -10895,6 +10896,14 @@
"prettier": "^1.18.2 || ^2.0.0"
}
},
+ "node_modules/vuex": {
+ "version": "3.6.2",
+ "resolved": "https://registry.npmmirror.com/vuex/-/vuex-3.6.2.tgz",
+ "integrity": "sha512-ETW44IqCgBpVomy520DT5jf8n0zoCac+sxWnn+hMe/CzaSejb/eVw2YToiXYX+Ex/AuHHia28vWTq4goAexFbw==",
+ "peerDependencies": {
+ "vue": "^2.0.0"
+ }
+ },
"node_modules/watchpack": {
"version": "2.4.1",
"resolved": "https://registry.npmmirror.com/watchpack/-/watchpack-2.4.1.tgz",
@@ -20009,6 +20018,12 @@
"integrity": "sha512-4gDntzrifFnCEvyoO8PqyJDmguXgVPxKiIxrBKjIowvL9l+N66196+72XVYR8BBf1Uv1Fgt3bGevJ+sEmxfZzw==",
"dev": true
},
+ "vuex": {
+ "version": "3.6.2",
+ "resolved": "https://registry.npmmirror.com/vuex/-/vuex-3.6.2.tgz",
+ "integrity": "sha512-ETW44IqCgBpVomy520DT5jf8n0zoCac+sxWnn+hMe/CzaSejb/eVw2YToiXYX+Ex/AuHHia28vWTq4goAexFbw==",
+ "requires": {}
+ },
"watchpack": {
"version": "2.4.1",
"resolved": "https://registry.npmmirror.com/watchpack/-/watchpack-2.4.1.tgz",
diff --git a/package.json b/package.json
index 29e37d2..8ad2c7e 100644
--- a/package.json
+++ b/package.json
@@ -14,7 +14,8 @@
"element-ui": "^2.15.14",
"less-loader": "^12.2.0",
"vue": "^2.6.14",
- "vue-router": "^2.8.1"
+ "vue-router": "^2.8.1",
+ "vuex": "^3.6.2"
},
"devDependencies": {
"@babel/core": "^7.12.16",
diff --git a/src/main.js b/src/main.js
index bb5a82a..e892f37 100644
--- a/src/main.js
+++ b/src/main.js
@@ -1,7 +1,7 @@
import Vue from 'vue'
import App from './App.vue'
import router from './router';
-
+import store from './store'; // 导入你配置好的store
Vue.config.productionTip = false
// 注册element-ui
import ElementUI from 'element-ui';
@@ -10,6 +10,7 @@ Vue.use(ElementUI);
new Vue({
+ store,
router,
render: h => h(App),
}).$mount('#app')
diff --git a/src/router/index.js b/src/router/index.js
index a8b32fb..4e086e6 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -15,7 +15,10 @@ const routes = [
{
path: 'user',
name: 'User',
- component: User
+ component: User,
+ meta: {
+ isLogin: true
+ },
},
{
path: 'login',
diff --git a/src/router/permission.js b/src/router/permission.js
new file mode 100644
index 0000000..daf098c
--- /dev/null
+++ b/src/router/permission.js
@@ -0,0 +1,22 @@
+import router from "./index";
+//路由守护
+router.beforeEach((to, from, next) => {
+ if (to.meta.isLogin) {
+ if (to.path === '/login') {
+ next()
+ }
+ else {
+ var tokenStr = window.localStorage.getItem('token')
+
+ if (!tokenStr) {
+ return next('/login')
+ }
+ else {
+ next()
+ }
+ }
+ }
+ else {
+ next();
+ }
+})
\ No newline at end of file
diff --git a/src/store/index.js b/src/store/index.js
new file mode 100644
index 0000000..81d7fc4
--- /dev/null
+++ b/src/store/index.js
@@ -0,0 +1,26 @@
+import Vue from 'vue'
+import Vuex from 'vuex'
+
+Vue.use(Vuex)
+
+export default new Vuex.Store({
+ state: {
+ token: localStorage.getItem('token') ? localStorage.getItem('token') : 'abc'
+ },
+ getters: {
+ },
+ mutations: {
+ setToken(state, token) {
+ state.token = token
+ localStorage.setItem("token", token)//存储token
+ },
+ delToken(state) {
+ state.token = ''
+ localStorage.removeItem("token")//删除token
+ }
+ },
+ actions: {
+ },
+ modules: {
+ }
+})
diff --git a/src/store/request.js b/src/store/request.js
new file mode 100644
index 0000000..ac251c4
--- /dev/null
+++ b/src/store/request.js
@@ -0,0 +1,55 @@
+import router from "@/router";
+import axios from "axios";
+import { Message } from "element-ui";
+
+//创建axios实例
+const axiosInstance = axios.create({
+ // baseURL: 'http://119.29.254.99:8887', // 设置默认发送地址为后端端口
+ baseURL: 'http://localhost:8081',
+});
+
+//添加拦截器，在每次ajax之前都会执行这个操作
+axiosInstance.interceptors.request.use(function (config) {
+ //从本地缓存获得token
+ const token = window.localStorage.getItem('token')
+
+ //如果存在将其加入请求头中
+ if (token) {
+ config.headers.token = token;
+ }
+ return config;
+}, function (error) {
+
+
+ return Promise.reject(error);//发生错误返回一个拒绝的promise对象
+})
+
+axiosInstance.interceptors.response.use(function (response) {
+ return response
+},
+ function (error) {
+ if (error.response.status === 401) {
+ router.push({ path: "/login" }, () => { }, () => { })
+ var msg = "登录超时,请重新登录"
+ Message({
+ message: msg,
+ type: 'error',
+ duration: 3000
+ })
+ localStorage.removeItem('token')
+ }
+ else if (error.response.status === 402) {
+ router.push({ path: "/login" });
+ }
+ else if (error.response.status === 500) {
+ var msg1 = '出现未知错误'
+ Message({
+ message: msg1,
+ type: 'error',
+ duration: 3000
+ })
+ }
+ }
+)
+
+export default axiosInstance;
\ No newline at end of file
diff --git a/src/views/Login.vue b/src/views/Login.vue
index 8b7c493..402e933 100644
--- a/src/views/Login.vue
+++ b/src/views/Login.vue
@@ -24,7 +24,7 @@
-
+
@@ -34,13 +34,13 @@
-
+
注册
@@ -52,7 +52,7 @@