Explorar o código

fix: 修复两个小程序退出登录后的页面跳转问题

## 问题
- Token 清除功能正常
- 但退出登录后页面没有跳转到登录页,停留在原页面
- 手动导航到登录页 URL 时被重定向回首页(路由守卫问题)

## 修复内容

### 1. 人才小程序 (rencai-auth-ui)
- `logoutMutation.onSuccess`: 添加延迟确保状态更新完成后再跳转
- `useRequireAuth`: 使用 `Taro.reLaunch` 替代 `Taro.redirectTo`,确保在 TabBar 页面也能正常跳转
- 移除不必要的 Toast 提示和 setTimeout 延迟

### 2. 企业小程序 (mini-enterprise-auth-ui)
- `logoutMutation.onSuccess`: 使用 `Taro.reLaunch` 替代 `Taro.redirectTo`,添加延迟确保状态更新完成
- `useRequireAuth`: 使用 `Taro.reLaunch` 替代 `Taro.redirectTo`,移除不必要的 Toast 提示和 setTimeout 延迟

### 3. 人才小程序设置页 (rencai-settings-ui)
- 使用 `useAuth` 的 `logout` 方法,移除重复的退出登录逻辑
- 简化代码,保持与 AuthProvider 一致的行为

### 4. 企业小程序设置页 (yongren-settings-ui)
- 使用 `useAuth` 的 `logout` 方法,移除重复的退出登录逻辑
- 添加 `useRequireAuth` 确保页面需要登录才能访问

## 技术细节
- `Taro.redirectTo` 在 TabBar 页面上可能不生效,因为 TabBar 页面不能被关闭
- `Taro.reLaunch` 会关闭所有页面并打开新页面,更适合退出登录场景
- 添加 100ms 延迟确保 React Query 状态更新完成后再跳转

Co-Authored-By: Claude <noreply@anthropic.com>
yourname hai 3 días
pai
achega
cb69f956c9

+ 7 - 3
mini-ui-packages/mini-enterprise-auth-ui/src/hooks/useAuth.tsx

@@ -43,7 +43,7 @@ export const AuthProvider: React.FC<PropsWithChildren> = ({ children }) => {
         const user = await response.json()
         Taro.setStorageSync('enterpriseUserInfo', JSON.stringify(user))
         return user
-      } catch (error) {
+      } catch (_error) {
         Taro.removeStorageSync('enterprise_token')
         Taro.removeStorageSync('enterpriseUserInfo')
         return null
@@ -112,9 +112,13 @@ export const AuthProvider: React.FC<PropsWithChildren> = ({ children }) => {
         Taro.removeStorageSync('enterpriseUserInfo')
       }
     },
-    onSuccess: () => {
+    onSuccess: async () => {
+      // 先清除用户状态
       queryClient.setQueryData(['currentUser'], null)
-      Taro.redirectTo({ url: '/pages/login/index' })
+      // 使用 reLaunch 关闭所有页面并跳转到登录页
+      // 添加延迟确保状态更新完成
+      await new Promise(resolve => setTimeout(resolve, 100))
+      Taro.reLaunch({ url: '/pages/login/index' })
     },
     onError: (error) => {
       Taro.showToast({

+ 4 - 10
mini-ui-packages/mini-enterprise-auth-ui/src/hooks/useRequireAuth.ts

@@ -10,18 +10,12 @@ export const useRequireAuth = () => {
   const { isLoggedIn, isLoading } = useAuth()
 
   useEffect(() => {
+    // 只有在非loading状态且未登录时才跳转
     if (!isLoading && !isLoggedIn) {
-      Taro.showToast({
-        title: '请先登录',
-        icon: 'none',
-        duration: 1500
+      // 使用 reLaunch 而不是 redirectTo,确保在 TabBar 页面也能正常跳转
+      Taro.reLaunch({
+        url: '/pages/login/index'
       })
-
-      setTimeout(() => {
-        Taro.redirectTo({
-          url: '/pages/login/index'
-        })
-      }, 1500)
     }
   }, [isLoggedIn, isLoading])
 

+ 9 - 12
mini-ui-packages/rencai-auth-ui/src/hooks/useAuth.tsx

@@ -28,7 +28,7 @@ export const queryClient = new QueryClient()
 export const AuthProvider: React.FC<{ children: ReactNode }> = ({ children }) => {
   const queryClient = useQueryClient()
 
-  const [isLoggedIn, setIsLoggedIn] = useState(false)
+  const [_isLoggedIn, setIsLoggedIn] = useState(false)
   const [token, setToken] = useState<string | null>(null)
   const [loading, setLoading] = useState(true)
 
@@ -120,8 +120,12 @@ export const AuthProvider: React.FC<{ children: ReactNode }> = ({ children }) =>
         Taro.removeStorageSync(USER_KEY)
       }
     },
-    onSuccess: () => {
+    onSuccess: async () => {
+      // 先清除用户状态
       queryClient.setQueryData(['talentCurrentUser'], null)
+      // 使用 reLaunch 关闭所有页面并跳转到登录页
+      // 添加延迟确保状态更新完成
+      await new Promise(resolve => setTimeout(resolve, 100))
       Taro.reLaunch({ url: '/pages/login/index' })
     },
     onError: (error) => {
@@ -182,17 +186,10 @@ export const useRequireAuth = (): void => {
   useEffect(() => {
     // 只有在非loading状态且未登录时才跳转
     if (!loading && !isLoggedIn) {
-      Taro.showToast({
-        title: '请先登录',
-        icon: 'none',
-        duration: 1500
+      // 使用 reLaunch 而不是 redirectTo,确保在 TabBar 页面也能正常跳转
+      Taro.reLaunch({
+        url: '/pages/login/index'
       })
-
-      setTimeout(() => {
-        Taro.redirectTo({
-          url: '/pages/login/index'
-        })
-      }, 1500)
     }
   }, [isLoggedIn, loading])
 }

+ 6 - 31
mini-ui-packages/rencai-settings-ui/src/pages/SettingsPage/SettingsPage.tsx

@@ -4,7 +4,7 @@ import Taro from '@tarojs/taro'
 import { useQuery } from '@tanstack/react-query'
 import { RencaiTabBarLayout } from '@d8d/rencai-shared-ui/components/RencaiTabBarLayout'
 import { Navbar } from '@d8d/mini-shared-ui-components/components/navbar'
-import { useRequireAuth } from '@d8d/rencai-auth-ui/hooks'
+import { useRequireAuth, useAuth } from '@d8d/rencai-auth-ui/hooks'
 import { UserProfileSummary } from '../../components/UserProfileSummary'
 import { MenuSection } from '../../components/MenuSection'
 import { LogoutButton } from '../../components/LogoutButton'
@@ -20,6 +20,9 @@ const SettingsPage: React.FC = () => {
   // 检查登录状态,未登录则重定向
   useRequireAuth()
 
+  // 使用 useAuth 的 logout 方法
+  const { logout } = useAuth()
+
   // 查询用户信息(使用React Query)
   const { data: profile, isLoading, error } = useQuery({
     queryKey: ['user-profile'],
@@ -125,41 +128,13 @@ const SettingsPage: React.FC = () => {
       content: '确定要退出登录吗?',
       success: (res) => {
         if (res.confirm) {
-          // 确认退出
-          performLogout()
+          // 使用 useAuth 的 logout 方法
+          logout()
         }
       }
     })
   }
 
-  // 执行退出登录
-  const performLogout = async () => {
-    try {
-      // 调用退出登录API
-      const res = await talentSettingsClient.logout.$post()
-      if (!res.ok) {
-        throw new Error('退出登录失败')
-      }
-
-      // 清除本地存储(使用与 useAuth 一致的 key)
-      Taro.removeStorageSync('talent_token')
-      Taro.removeStorageSync('talent_user')
-
-      // 跳转到登录页
-      Taro.reLaunch({ url: '/pages/login/index' })
-
-      Taro.showToast({
-        title: '已退出登录',
-        icon: 'success'
-      })
-    } catch (_error) {
-      Taro.showToast({
-        title: '退出登录失败',
-        icon: 'none'
-      })
-    }
-  }
-
   // 加载状态
   if (isLoading) {
     return (

+ 6 - 10
mini-ui-packages/yongren-settings-ui/src/pages/Settings/Settings.tsx

@@ -4,14 +4,16 @@ import Taro from '@tarojs/taro'
 import { useQuery } from '@tanstack/react-query'
 import { YongrenTabBarLayout } from '@d8d/yongren-shared-ui/components/YongrenTabBarLayout'
 import { Navbar } from '@d8d/mini-shared-ui-components/components/navbar'
-import { useAuth } from '@d8d/mini-enterprise-auth-ui/hooks'
+import { useAuth, useRequireAuth } from '@d8d/mini-enterprise-auth-ui/hooks'
 import { enterpriseCompanyClient } from '../../api/companyClient'
 
 // 延期功能列表(因史诗012系统设置API延期)
 const DEFERRED_FEATURES = ['账号信息', '安全设置', '消息通知']
 
 const Settings: React.FC = () => {
-  const { user } = useAuth()
+  const { user, logout } = useAuth()
+  // 检查登录状态,未登录则重定向
+  useRequireAuth()
 
   // 获取企业概览信息
   const { data: companyOverview, isLoading } = useQuery({
@@ -63,14 +65,8 @@ const Settings: React.FC = () => {
       content: '确定要退出登录吗?',
       success: (res) => {
         if (res.confirm) {
-          // 清除本地存储的认证信息(使用与 useAuth 一致的 key)
-          Taro.removeStorageSync('enterprise_token')
-          Taro.removeStorageSync('enterpriseUserInfo')
-
-          // 跳转到登录页
-          Taro.reLaunch({
-            url: '/pages/login/index'
-          })
+          // 使用 useAuth 的 logout 方法
+          logout()
         }
       }
     })