Cookie

Author: laoshanxi

package.json

@@ -18,7 +18,7 @@
     "@antv/data-set": "^0.11.8",
     "@antv/g2": "^4.2.10",
     "af-table-column": "^1.0.3",
-    "appmesh": "^1.0.1",
+    "appmesh": "^1.0.2",
     "axios": "^1.6.2",
     "element-ui": "^2.15.14",
     "js-base64": "^3.7.5",

src/layout/components/Navbar.vue

@@ -129,7 +129,7 @@ export default {
         this.fullscreenLoading = true;
 
         getClient().forwardingHost = this.forward;
-        await getClient().authenticate(getClient().jwtToken);
+        await getClient().authenticate();
         await this.$store.dispatch("settings/changeSetting", {
           key: "forwarding",
           value: this.forward

src/permission.js

@@ -3,7 +3,6 @@ import store from './store'
 import { Message } from 'element-ui'
 import NProgress from 'nprogress' // progress bar
 import 'nprogress/nprogress.css' // progress bar style
-import { getToken } from '@/utils/auth' // get token from cookie
 import getPageTitle from '@/utils/get-page-title'
 
 NProgress.configure({ showSpinner: false }) // NProgress Configuration
@@ -18,72 +17,52 @@ router.beforeEach(async (to, from, next) => {
   // set page title
   document.title = getPageTitle(to.meta.title)
 
-  // determine whether the user has logged in
-  const hasToken = getToken()
 
-  if (hasToken) {
-    if (to.path === '/login') {
-      // if is logged in, redirect to the home page
-      next({ path: '/' })
-      NProgress.done()
-    } else {
-      // TODO: When the browser is closed and reopened, the user permission info will be lost.
-      // If the user navigates directly to another page without going through the login page,
-      // the permissions need to be re-validated.
-      const hasGetUserInfo = store.getters.user
-      if (hasGetUserInfo) {
-        if (to.meta && to.meta.roles && to.meta.roles.length > 0) {
-          let curPermissions = to.meta.roles;
-          let permissions = hasGetUserInfo.permissions;
-          let hasPermission = false;
-          if (permissions) {
-            for (let i = 0; i < curPermissions.length; i++) {
-              if (permissions.indexOf(curPermissions[i]) >= 0) {
-                hasPermission = true;
-                break;
-              }
-            }
-          }
 
-          if (hasPermission) {
-            next();
-          } else {
-            next('/401');
-            NProgress.done();
-            setTimeout(() => {
-              store.dispatch("app/setLoading", false);
-            }, 1000);
+
+  // TODO: When the browser is closed and reopened, the user permission info will be lost.
+  // If the user navigates directly to another page without going through the login page,
+  // the permissions need to be re-validated.
+  const hasGetUserInfo = store.getters.user
+  if (hasGetUserInfo) {
+    if (to.meta && to.meta.roles && to.meta.roles.length > 0) {
+      let curPermissions = to.meta.roles;
+      let permissions = hasGetUserInfo.permissions;
+      let hasPermission = false;
+      if (permissions) {
+        for (let i = 0; i < curPermissions.length; i++) {
+          if (permissions.indexOf(curPermissions[i]) >= 0) {
+            hasPermission = true;
+            break;
           }
-        } else {
-          next();
         }
-      } else {
-        try {
-          // get user info
-          await store.dispatch('user/getInfo')
+      }
 
-          next()
-        } catch (error) {
-          // remove token and go to login page to re-login
-          await store.dispatch('user/resetToken')
-          Message.error(error || 'Has Error')
-          next(`/login?redirect=${to.path}`)
-          NProgress.done()
-        }
+      if (hasPermission) {
+        next();
+      } else {
+        next('/401');
+        NProgress.done();
+        setTimeout(() => {
+          store.dispatch("app/setLoading", false);
+        }, 1000);
       }
+    } else {
+      next();
     }
   } else {
-    /* has no token*/
+    try {
+      // get user info
+      await store.dispatch('user/getInfo')
 
-    if (whiteList.indexOf(to.path) !== -1) {
-      // in the free login whitelist, go directly
       next()
-    } else {
-      // other pages that do not have permission to access are redirected to the login page.
+    } catch (error) {
+      Message.error(error || 'Has Error')
       next(`/login?redirect=${to.path}`)
       NProgress.done()
     }
   }
+
 })
 
 router.afterEach(() => {

src/store/modules/user.js

@@ -1,12 +1,10 @@
-import { getToken, setToken, removeToken, setUser, getUser, removeUser } from '@/utils/auth'
+import { setUser, getUser, removeUser } from '@/utils/auth'
 import { getClient } from '@/utils/appmeshClient'
 import { resetRouter } from '@/router'
-import { Base64 } from 'js-base64'
 
 let user = getUser();
 
 const state = {
-  token: getToken(),
   name: user ? user.name : '',
   account: user ? user.account : '',
   auth: user ? user.auth : '',
@@ -15,9 +13,6 @@ const state = {
 }
 
 const mutations = {
-  SET_TOKEN: (state, token) => {
-    state.token = token
-  },
   SET_NAME: (state, name) => {
     state.name = name
   },
@@ -40,9 +35,9 @@ const actions = {
   login({ commit }, userInfo) {
     const { UserName, Password, Audience } = userInfo
     return new Promise((resolve, reject) => {
-      getClient().login(UserName, Password, null, 'P1D', Audience).then(token => {
+      getClient().login(UserName, Password, null, 'P1D', Audience).then(() => {
         // Login success without TOTP
-        actions.handleLoginSuccess({ commit, token, UserName, Password, resolve, reject })
+        actions.handleLoginSuccess({ commit, UserName, Password, resolve, reject })
       }).catch(error => {
         reject(error)
       })
@@ -52,32 +47,23 @@ const actions = {
   // TOTP login
   validateTotp({ commit }, { username, challenge, totp, expireSeconds }) {
     return new Promise((resolve, reject) => {
-      getClient().validate_totp(username, challenge, totp, expireSeconds).then(token => {
-        actions.handleLoginSuccess({ commit, token, username, resolve, reject })
+      getClient().validate_totp(username, challenge, totp, expireSeconds).then(() => {
+        actions.handleLoginSuccess({ commit, username, resolve, reject })
       }).catch(error => {
         console.error('TOTP validation error:', error)
         reject(error)
       })
     })
   },
 
-  handleLoginSuccess({ commit, token, UserName, Password, resolve, reject }) {
-    if (!token) {
-      console.error('Login success handler failed: Invalid response', token)
-      reject(new Error('Invalid login response'));
-      return;
-    }
-
+  handleLoginSuccess({ commit, UserName, Password, resolve, reject }) {
     const user = {
-      token: token,
       name: UserName,
       account: UserName,
       auth: Password,
       avatar: "https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png"
     };
 
-    setToken(user.token);
-    commit('SET_TOKEN', user.token);
     commit('SET_NAME', user.name);
     commit('SET_ACCOUNT', user.account);
     commit('SET_AUTH', user.auth);
@@ -101,14 +87,13 @@ const actions = {
   getInfo({ commit, state }) {
     return new Promise((resolve, reject) => {
       getClient().view_self().then(data => {
-
         if (!data) {
           console.error('Get user info failed: Empty response')
           reject('Verification failed, please Login again.')
+          return
         }
 
         const { name, avatar } = data
-
         commit('SET_NAME', name)
         commit('SET_AVATAR', avatar)
         resolve(data)
@@ -127,24 +112,13 @@ const actions = {
       }).catch((error) => {
         console.error('Failed to log off:', error)
       })
-      commit('SET_TOKEN', '')
       commit('SET_NAME', '')
       commit('SET_ACCOUNT', '')
       commit('SET_AUTH', '')
       commit('SET_AVATAR', '')
-      commit('SET_PERMISSIONS', '');  // 添加清除权限
-      removeUser();
-      removeToken();
-      resetRouter();
-      resolve();
-    });
-  },
-
-  // remove token
-  resetToken({ commit }) {
-    return new Promise(resolve => {
-      commit('SET_TOKEN', '')
-      removeToken()
+      commit('SET_PERMISSIONS', '')
+      removeUser()
+      resetRouter()
       resolve()
     })
   }

src/utils/appmeshClient.js

@@ -5,14 +5,13 @@ import { HttpStatus } from './constants'
 import store from '@/store'
 import router from '@/router'
 
-const INSTANCE_KEY = '__APP_MESH_CLIENT__';
 
 /**
  * Vue-specific implementation of AppMeshClient with UI integration
  */
 export class VueAppMeshClient extends AppMeshClient {
   constructor(options = {}) {
-    super(options.baseURL, options.sslConfig, options.jwtToken);
+    super(options.baseURL, options.sslConfig);
   }
 
   /**
@@ -25,10 +24,6 @@ export class VueAppMeshClient extends AppMeshClient {
     // First check if error is a valid object with statusCode
     if (error && typeof error === 'object' && 'statusCode' in error) {
       if (error.statusCode === HttpStatus.UNAUTHORIZED) {
-        // Clear token to avoid next token re-use
-        this.jwtToken = null;
-        removeToken();
-
         // Logout user and redirect to login page
         store.dispatch('user/logout')
           .catch(logoutError => console.error('Logout error:', logoutError));
@@ -52,6 +47,8 @@ export class VueAppMeshClient extends AppMeshClient {
   }
 }
 
+const INSTANCE_KEY = '__APP_MESH_CLIENT__';
+
 /**
  * Get the AppMesh client instance
  * @param {Object} [data] - Optional configuration data
@@ -64,13 +61,9 @@ export function getClient(data = null) {
   }
 
   const client = window[INSTANCE_KEY];
-  const token = store.getters?.token;
   const forwardingHost = store.getters?.forwarding;
   const headers = data?.headers || {};
 
-  if (token && !('Authorization' in headers)) {
-    client.jwtToken = getToken();
-  }
   if (forwardingHost && !('X-Target-Host' in headers)) {
     client.forwardingHost = forwardingHost;
   }

src/utils/auth.js

@@ -1,20 +1,3 @@
-import Cookies from 'js-cookie'
-import { getClient } from '@/utils/appmeshClient'
-
-const TokenKey = 'vue_admin_template_token'
-
-export function getToken() {
-  return Cookies.get(TokenKey)
-}
-
-export function setToken(token) {
-  return Cookies.set(TokenKey, token)
-}
-
-export function removeToken() {
-  return Cookies.remove(TokenKey)
-}
-
 export function setUser(user) {
   sessionStorage["user"] = JSON.stringify(user);
 }
@@ -26,4 +9,3 @@ export function getUser() {
 export function removeUser() {
   sessionStorage["user"] = null;
 }
-

src/views/security/changePwd.vue

@@ -54,7 +54,6 @@
 
 <script>
 import { getClient } from '@/utils/appmeshClient'
-import { setToken } from '@/utils/auth'
 import VueQrcode from 'qrcode.vue'
 
 export default {
@@ -128,8 +127,7 @@ export default {
       }
 
       try {
-        const token = await getClient().setup_totp(this.totpCode);
-        setToken(token);
+        await getClient().setup_totp(this.totpCode);
         this.$message.success('MFA setup successfully');
         this.qrDialogVisible = false;
         this.qrCodeData = '';