fix(TAP-12185): restore missing permission cache

Author: feynmx

apps/daas/src/directives/index.ts

@@ -1,8 +1,8 @@
 import { ClipboardPlugin, Cookie } from '@tap/shared'
+import { getCachedPermissions } from '@/utils/util'
 
 export function hasPermissionByCode(code) {
-  let permissions = sessionStorage.getItem('tapdata_permissions')
-  permissions = JSON.parse(permissions)
+  const permissions = getCachedPermissions()
 
   if (!permissions || permissions.length === 0) {
     return false

apps/daas/src/layouts/Sidebar.vue

@@ -4,6 +4,7 @@ import { computed, inject, onMounted, ref, type Ref } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
 import { useStore } from 'vuex'
 import { MENU as menuSetting } from '@/router/menu'
+import { getCachedPermissions } from '@/utils/util'
 
 // Types
 interface MenuItem {
@@ -47,15 +48,7 @@ const isMenuEnabled = computed(() => store.getters['feature/isMenuEnabled'])
 
 // Methods
 const getMenus = (hideMenuMap: Record<string, boolean> = {}) => {
-  let permissions: any[] = []
-  const permissionsStr = sessionStorage.getItem('tapdata_permissions')
-  if (permissionsStr) {
-    try {
-      permissions = JSON.parse(permissionsStr)
-    } catch (error) {
-      console.error('Failed to parse permissions', error)
-    }
-  }
+  const permissions = getCachedPermissions() || []
 
   const routerMap: Record<string, any> = {}
   const routes = router.options.routes

apps/daas/src/main.ts

@@ -18,7 +18,7 @@ import App from '@/App.vue'
 import { installOEM } from '@/oem'
 import { installAllPlugins } from '@/plugins'
 import { initRequestClient } from '@/plugins/axios'
-import { configUser, getUrlSearch } from '@/utils/util'
+import { configUser, getUrlSearch, signOut } from '@/utils/util'
 import store from '@/vuex' // 引入全局数据控制
 import { installDirectives } from './directives'
 import i18n from './i18n'
@@ -122,23 +122,23 @@ const loading = ElLoading.service({ fullscreen: true })
 const bootstrap = async () => {
   if (token) {
     //无权限，说明是首次进入页面，重新请求后台获取
-    const user = await getUserInfoByToken().catch(() => {
-      init()
-      return null
-    })
+    const user = await getUserInfoByToken().catch(() => null)
 
-    if (user) {
-      configUser(user)
+    if (!user) {
+      signOut()
+      return
+    }
 
-      const settings = await fetchSettings()
-      setSettings(settings)
+    configUser(user)
 
-      await store.dispatch('feature/getFeatures')
+    const settings = await fetchSettings()
+    setSettings(settings)
 
-      if (settings.length) {
-        localStorage.setItem('TAPDATA_SETTINGS', JSON.stringify(settings))
-        store.commit('setAppearanceBySetting', settings)
-      }
+    await store.dispatch('feature/getFeatures')
+
+    if (settings.length) {
+      localStorage.setItem('TAPDATA_SETTINGS', JSON.stringify(settings))
+      store.commit('setAppearanceBySetting', settings)
     }
   }
 

apps/daas/src/router/index.ts

@@ -10,14 +10,15 @@ import {
 } from 'vue-router'
 
 import i18n from '@/i18n'
+import { ensurePermissions, signOut } from '@/utils/util'
 import { routes } from './routes'
 
 const router = createRouter({
   history: createWebHashHistory(),
   routes: routes as readonly RouteRecordRaw[],
 })
 
-router.beforeEach((to, from, next) => {
+router.beforeEach(async (to, from, next) => {
   if (!to.matched.length) {
     Message.error({
       message: 'Page not found!',
@@ -30,9 +31,14 @@ router.beforeEach((to, from, next) => {
   }
   const token = Cookie.get('access_token')
   if (token) {
-    //若token存在，获取权限
-    const permissionsStr = sessionStorage.getItem('tapdata_permissions')
-    const permissions = JSON.parse(permissionsStr)
+    let permissions: Awaited<ReturnType<typeof ensurePermissions>> = []
+
+    try {
+      permissions = await ensurePermissions()
+    } catch {
+      signOut()
+      return
+    }
 
     //判断当前路由的页面是否有权限，无权限则不跳转，有权限则执行跳转
     let matched = true

apps/daas/src/utils/util.ts

@@ -1,25 +1,150 @@
+import { getUserInfoByToken } from '@tap/api/src/core/users'
 import Cookie from '@tap/shared/src/cookie'
 import dayjs from 'dayjs'
 import i18n from '@/i18n'
 
+type PermissionResource = { code?: string } & Record<string, any>
+
+const PERMISSIONS_STORAGE_KEY = 'tapdata_permissions'
+
+let cachedPermissions: PermissionResource[] | null = null
+let permissionsRequest: Promise<PermissionResource[]> | null = null
+
+function getPermissionDebugContext() {
+  const navigation = performance.getEntriesByType?.('navigation')?.[0] as
+    | PerformanceNavigationTiming
+    | undefined
+
+  return {
+    href: location.href,
+    navigationType: navigation?.type,
+    visibilityState: document.visibilityState,
+    wasDiscarded: (document as Document & { wasDiscarded?: boolean })
+      .wasDiscarded,
+  }
+}
+
+function debugPermissions(message: string, details: Record<string, any> = {}) {
+  // eslint-disable-next-line no-console
+  console.debug('[tapdata_permissions]', message, {
+    ...getPermissionDebugContext(),
+    ...details,
+  })
+}
+
+function flattenPermissions(user: Record<string, any> = {}) {
+  const permissions: PermissionResource[] = []
+  const list = user?.permissions || []
+
+  list.forEach((permission: Record<string, any>) => {
+    if (permission.resources && permission.resources.length > 0) {
+      permission.resources.forEach((res: PermissionResource) => {
+        permissions.push(res)
+      })
+    }
+  })
+
+  return permissions
+}
+
+function setPermissions(permissions: PermissionResource[]) {
+  cachedPermissions = permissions
+  sessionStorage.setItem(PERMISSIONS_STORAGE_KEY, JSON.stringify(permissions))
+
+  if (!permissions.length) {
+    debugPermissions('wrote empty permissions cache')
+  }
+}
+
+export function clearPermissions() {
+  cachedPermissions = null
+  permissionsRequest = null
+  sessionStorage.removeItem(PERMISSIONS_STORAGE_KEY)
+  debugPermissions('cleared permissions cache')
+}
+
+export function getCachedPermissions() {
+  const permissionsStr = sessionStorage.getItem(PERMISSIONS_STORAGE_KEY)
+
+  if (permissionsStr !== null) {
+    try {
+      const permissions = JSON.parse(permissionsStr)
+
+      if (Array.isArray(permissions)) {
+        cachedPermissions = permissions
+        return permissions as PermissionResource[]
+      }
+      debugPermissions('removed invalid permissions cache', {
+        valueType: typeof permissions,
+      })
+      sessionStorage.removeItem(PERMISSIONS_STORAGE_KEY)
+    } catch (error) {
+      debugPermissions('removed unparsable permissions cache', {
+        errorMessage: error?.message,
+        valueLength: permissionsStr.length,
+      })
+      sessionStorage.removeItem(PERMISSIONS_STORAGE_KEY)
+    }
+  }
+
+  if (cachedPermissions) {
+    debugPermissions('using in-memory permissions cache', {
+      permissionsCount: cachedPermissions.length,
+    })
+    return cachedPermissions
+  }
+
+  return null
+}
+
 export function configUser(user: Record<string, any> = {}) {
   Cookie.set('email', user.email)
   Cookie.set('username', user.username || '')
   Cookie.set('isAdmin', String(Number.parseInt(user.role) || 0))
   Cookie.set('user_id', user.id)
-  const permissions: string[] = []
-  const list = user?.permissions || []
-  if (list.length) {
-    list.forEach((permission: Record<string, any>) => {
-      if (permission.resources && permission.resources.length > 0) {
-        permission.resources.forEach((res: string) => {
-          permissions.push(res)
+  const permissions = flattenPermissions(user)
+
+  setPermissions(permissions)
+
+  return permissions
+}
+
+export function ensurePermissions() {
+  const permissions = getCachedPermissions()
+
+  if (permissions) {
+    return Promise.resolve(permissions)
+  }
+
+  debugPermissions('permissions cache missing, refetching user permissions')
+
+  if (!permissionsRequest) {
+    permissionsRequest = getUserInfoByToken()
+      .then((user) => {
+        const nextPermissions = configUser(user || {})
+
+        debugPermissions('refetched user permissions', {
+          hasUser: Boolean(user),
+          permissionsCount: nextPermissions.length,
+          userId: user?.id,
         })
-      }
-    })
-    sessionStorage.setItem('tapdata_permissions', JSON.stringify(permissions))
+
+        return nextPermissions
+      })
+      .catch((error) => {
+        debugPermissions('failed to refetch user permissions', {
+          errorMessage: error?.message,
+          status: error?.response?.status,
+        })
+
+        throw error
+      })
+      .finally(() => {
+        permissionsRequest = null
+      })
   }
-  return permissions
+
+  return permissionsRequest
 }
 
 export function signOut() {
@@ -29,7 +154,7 @@ export function signOut() {
   Cookie.remove('isAdmin')
   Cookie.remove('user_id')
   sessionStorage.setItem('lastLocationHref', location.href)
-  sessionStorage.removeItem('tapdata_permissions')
+  clearPermissions()
   location.href = `${location.href.split('#')[0]}#/login`
   return null
 }