亚洲乱色熟女一区二区三区丝袜,天堂√中文最新版在线,亚洲精品乱码久久久久久蜜桃图片,香蕉久久久久久av成人,欧美丰满熟妇bbb久久久

LOGO OA教程 ERP教程 模切知識交流 PMS教程 CRM教程 開發(fā)文檔 其他文檔  
 
網(wǎng)站管理員

【W(wǎng)EB開發(fā)】如何做用戶超過24小時沒有操作頁面而跳轉(zhuǎn)至登錄?

admin
2025年7月3日 7:47 本文熱度 58

在現(xiàn)代前端開發(fā)中,我們常常需要做一個長期停留在某頁面不操作跳轉(zhuǎn)至登錄頁面的效果。這個看似簡單的需求,背后卻關(guān)聯(lián)著用戶體驗、數(shù)據(jù)分析和系統(tǒng)性能等多個重要方面,如下是從vue項目中摘出邏輯代碼供大家參考。

config中

/** * @description 導(dǎo)出通用配置 */module.exports = {  keepStorageTime: 24  //存儲storage時間長度(目前只控制localStorage存儲用戶信息的時長,單位為小時)  }
userInfor.js
1,登錄的時候會調(diào)用該setUserInfor方法,也更新保存時間localStorage keepStorageTime(現(xiàn)在的時間加上24小時)
2,每次進(jìn)內(nèi)頁調(diào)方法getUserInfor,如果Date.now()<緩存的keepStorageTime,便清除用戶信息(沒有用戶信息就過不了路由守衛(wèi),而跳轉(zhuǎn)至登錄界面)
import {  keepStorageTime } from '@/config'// 設(shè)置保存時間為24小時,超過24小時沒有訪問過內(nèi)頁的話,重新進(jìn)內(nèi)頁會因為沒有用戶信息跳轉(zhuǎn)至登錄let expires = Date.now() + 1000 * 60 * 60 * keepStorageTime/** * @description 存儲用戶信息,登錄的時候會調(diào)用該方法 * @param token * @returns {void|*} */export function setUserInfor(userInfor) {        //存儲用戶信息的時候存儲keepStorageTime時間( 緩存保存時間)      localStorage.setItem('keepStorageTime'JSON.stringify(expires))      return localStorage.setItem(userInforTableName, userInfor)}/** * @description 獲取用戶信息,進(jìn)內(nèi)頁都會調(diào)用 * @returns {string|ActiveX.IXMLDOMNode|Promise<any>|any|IDBRequest<any>|MediaKeyStatus|FormDataEntryValue|Function|Promise<Credential | null>} */export function getUserInfor() {      //當(dāng)前時間大于 expires時間( 緩存保存時間)清除用戶信息    let item = JSON.parse(localStorage.getItem('keepStorageTime'))    if (item) {      if (item < Date.now()) {        removeUserInfor()      }    }    if ('localStorage' === storage) {      return localStorage.getItem(userInforTableName)    }  }
3,路由守衛(wèi)中,進(jìn)到內(nèi)頁后時,更新保存時間 localStorage keepStorageTime
import {  keepStorageTime,from '@/config'
router.beforeEach(async (to, from, next) => {  const { showProgressBar } = store.getters['settings/theme']  if (showProgressBar) VabProgress.start()  let hasToken = store.getters['user/token']  if (!loginInterception) hasToken = true  if (hasToken) {    if (store.getters['routes/routes'].length) {      // 禁止已登錄用戶返回登錄頁      if (to.path === '/login') {        next({ path'/' })        if (showProgressBar) VabProgress.done()      } else {        //存儲用戶信息的時候存儲expires時間( 緩存保存時間)        // 更新保存時間expires,超過24小時沒有訪問過內(nèi)頁的話,重新進(jìn)內(nèi)頁會因為沒有用戶信息跳轉(zhuǎn)至登錄        let expires = Date.now() + 1000 * 60 * 60 * keepStorageTime        localStorage.setItem('keepStorageTime'JSON.stringify(expires))        next()      }    } else {      try {        if (loginInterception) await store.dispatch('user/getUserInfo')        // config/setting.config.js loginInterception為false(關(guān)閉登錄攔截時)時,創(chuàng)建虛擬角色        else await store.dispatch('user/setVirtualRoles')        // 根據(jù)路由模式獲取路由并根據(jù)權(quán)限過濾        await store.dispatch('routes/setRoutes', authentication)        next({ ...to, replacetrue })      } catch (err) {        console.error('vue-admin-beautiful錯誤攔截:', err)        await store.dispatch('user/resetAll')        next(toLoginRoute(to.path))      }    }  } else {    if (routesWhiteList.includes(to.path)) {      // 設(shè)置游客路由(不需要可以刪除)      if (supportVisit && !store.getters['routes/routes'].length) {        await store.dispatch('routes/setRoutes''visit')        next({ ...to, replacetrue })      } else next()    } else next(toLoginRoute(to.path))  }})

user/resetAll:

退出的時候調(diào)用重置的時候清除keepStorageTime和用戶信息及token
  async resetAll({ commit, dispatch }) {    // console.log('resetAllresetAll')         removeUserInfor()    localStorage.removeItem('keepStorageTime')  },

閱讀原文:https://mp.weixin.qq.com/s/TiuElk4Q9FgxL9pAV2T02g


該文章在 2025/7/3 23:46:09 編輯過
關(guān)鍵字查詢
相關(guān)文章
正在查詢...
點晴ERP是一款針對中小制造業(yè)的專業(yè)生產(chǎn)管理軟件系統(tǒng),系統(tǒng)成熟度和易用性得到了國內(nèi)大量中小企業(yè)的青睞。
點晴PMS碼頭管理系統(tǒng)主要針對港口碼頭集裝箱與散貨日常運作、調(diào)度、堆場、車隊、財務(wù)費用、相關(guān)報表等業(yè)務(wù)管理,結(jié)合碼頭的業(yè)務(wù)特點,圍繞調(diào)度、堆場作業(yè)而開發(fā)的。集技術(shù)的先進(jìn)性、管理的有效性于一體,是物流碼頭及其他港口類企業(yè)的高效ERP管理信息系統(tǒng)。
點晴WMS倉儲管理系統(tǒng)提供了貨物產(chǎn)品管理,銷售管理,采購管理,倉儲管理,倉庫管理,保質(zhì)期管理,貨位管理,庫位管理,生產(chǎn)管理,WMS管理系統(tǒng),標(biāo)簽打印,條形碼,二維碼管理,批號管理軟件。
點晴免費OA是一款軟件和通用服務(wù)都免費,不限功能、不限時間、不限用戶的免費OA協(xié)同辦公管理系統(tǒng)。
Copyright 2010-2025 ClickSun All Rights Reserved