session过期自动跳转到登录页面

src/router/index.js

@@ -156,12 +156,13 @@ const mainRoutes = {
     { path: '/home', component: _import('common/home'), name: 'home', meta: { title: '首页' } },
   ],
   beforeEnter (to, from, next) {
-    let token =Vue.cookie.get('token')
+    let token = Vue.cookie.get('token')
     if (!token || !/\S/.test(token)) {
       clearLoginInfo()
       next({ name: 'login' })
+    } else {
+      next()
     }
-    next()
   }
 }
 
@@ -175,6 +176,16 @@ const router = new Router({
 })
 
 router.beforeEach((to, from, next) => {
+  // 检查登录状态（除了登录页和404页）
+  if (to.name !== 'login' && to.name !== '404') {
+    let token = Vue.cookie.get('token')
+    if (!token || !/\S/.test(token)) {
+      clearLoginInfo()
+      next({ name: 'login' })
+      return
+    }
+  }
+  
   // 添加动态(菜单)路由
   // 1. 已经添加 or 全局路由, 直接访问
   // 2. 获取菜单列表, 添加并保存本地存储
@@ -192,10 +203,18 @@ router.beforeEach((to, from, next) => {
         sessionStorage.setItem('menuList', JSON.stringify(data.menuList || '[]'))
         sessionStorage.setItem('permissions', JSON.stringify(data.permissions || '[]'))
         //next({ ...to, replace: true })
+      } else if (data && data.code === 401) {
+        // session过期
+        console.log('会话已过期，跳转至登录页')
+        clearLoginInfo()
+        next({ name: 'login' })
+        return
       }
     }).catch((e) => {
       console.log(`%c${e} 请求菜单列表和权限失败，跳转至登录页！！`, 'color:blue')
-      router.push({ name: 'login' })
+      clearLoginInfo()
+      next({ name: 'login' })
+      return
     })
     router.options.isAddDynamicMenuRoutes = true
     next({ ...to, replace: true })

src/utils/httpRequest.js

@@ -35,6 +35,27 @@ http.interceptors.response.use(response => {
   }
   return response
 }, error => {
+  // 处理HTTP错误响应
+  if (error.response) {
+    // 服务器返回了错误状态码
+    if (error.response.status === 401) {
+      // HTTP 401 未授权
+      clearLoginInfo()
+      router.push({ name: 'login' })
+      return Promise.reject(error)
+    }
+    
+    // 检查响应体中的code字段
+    if (error.response.data && error.response.data.code === 401) {
+      clearLoginInfo()
+      router.push({ name: 'login' })
+      return Promise.reject(error)
+    }
+  } else if (error.request) {
+    // 请求已发出但没有收到响应（网络错误）
+    console.error('网络请求失败:', error.message)
+  }
+  
   return Promise.reject(error)
 })
 
@@ -108,6 +129,27 @@ instance.interceptors.response.use(response => {
   }
   return response
 }, error => {
+  // 处理HTTP错误响应
+  if (error.response) {
+    // 服务器返回了错误状态码
+    if (error.response.status === 401) {
+      // HTTP 401 未授权
+      clearLoginInfo()
+      router.push({ name: 'login' })
+      return Promise.reject(error)
+    }
+    
+    // 检查响应体中的code字段
+    if (error.response.data && error.response.data.code === 401) {
+      clearLoginInfo()
+      router.push({ name: 'login' })
+      return Promise.reject(error)
+    }
+  } else if (error.request) {
+    // 请求已发出但没有收到响应（网络错误）
+    console.error('网络请求失败:', error.message)
+  }
+  
   return Promise.reject(error)
 })