diff --git a/src/components/Navbars/HomeNavbar.js b/src/components/Navbars/HomeNavbar.js index 288b3b0c..5a1dc1f4 100644 --- a/src/components/Navbars/HomeNavbar.js +++ b/src/components/Navbars/HomeNavbar.js @@ -788,47 +788,47 @@ export default function HomeNavbar() { // 加载订阅信息 React.useEffect(() => { - const userIdChanged = prevUserIdRef.current !== userId; - const authChanged = prevIsAuthenticatedRef.current !== isAuthenticated; - - if (userIdChanged || authChanged) { - if (isAuthenticated && user) { - const loadSubscriptionInfo = async () => { - try { - const base = getApiBase(); - const response = await fetch(base + '/api/subscription/current', { - credentials: 'include', - }); - if (response.ok) { - const data = await response.json(); - if (data.success && data.data) { - // 数据标准化处理:确保type字段是小写的 'free', 'pro', 或 'max' - const normalizedData = { - type: (data.data.type || data.data.subscription_type || 'free').toLowerCase(), - status: data.data.status || 'active', - days_left: data.data.days_left || 0, - is_active: data.data.is_active !== false, - end_date: data.data.end_date || null - }; - setSubscriptionInfo(normalizedData); - } + // ✅ 移除 ref 检查,直接根据登录状态加载 + if (isAuthenticated && user) { + const loadSubscriptionInfo = async () => { + try { + const base = getApiBase(); + logger.debug('HomeNavbar', '开始加载订阅信息', { user_id: user?.id }); + const response = await fetch(base + '/api/subscription/current', { + credentials: 'include', + }); + if (response.ok) { + const data = await response.json(); + logger.debug('HomeNavbar', 'API 返回订阅数据', data); + if (data.success && data.data) { + // 数据标准化处理:确保type字段是小写的 'free', 'pro', 或 'max' + const normalizedData = { + type: (data.data.type || data.data.subscription_type || 'free').toLowerCase(), + status: data.data.status || 'active', + days_left: data.data.days_left || 0, + is_active: data.data.is_active !== false, + end_date: data.data.end_date || null + }; + logger.info('HomeNavbar', '订阅信息已更新', normalizedData); + setSubscriptionInfo(normalizedData); } - } catch (error) { - logger.error('HomeNavbar', '加载订阅信息失败', error); } - }; - loadSubscriptionInfo(); - } else { - // 用户未登录时,重置为免费版 - setSubscriptionInfo({ - type: 'free', - status: 'active', - days_left: 0, - is_active: true - }); - } + } catch (error) { + logger.error('HomeNavbar', '加载订阅信息失败', error); + } + }; + loadSubscriptionInfo(); + } else { + // 用户未登录时,重置为免费版 + logger.debug('HomeNavbar', '用户未登录,重置订阅信息为免费版'); + setSubscriptionInfo({ + type: 'free', + status: 'active', + days_left: 0, + is_active: true + }); } - }, [isAuthenticated, userId, user]); // ⚡ 使用 userId,防重复通过 ref 判断 + }, [isAuthenticated, userId, user]); // ✅ React 会自动去重,不会造成无限循环 return ( <> diff --git a/src/mocks/data/users.js b/src/mocks/data/users.js index 45d832f0..5eeda785 100644 --- a/src/mocks/data/users.js +++ b/src/mocks/data/users.js @@ -112,12 +112,20 @@ export function getCurrentUser() { const stored = localStorage.getItem('mock_current_user'); if (stored) { const user = JSON.parse(stored); - console.log('[Mock State] 获取当前登录用户:', user); + console.log('[Mock State] 获取当前登录用户:', { + id: user.id, + phone: user.phone, + nickname: user.nickname, + subscription_type: user.subscription_type, + subscription_status: user.subscription_status, + subscription_days_left: user.subscription_days_left + }); return user; } } catch (error) { console.error('[Mock State] 解析用户数据失败:', error); } + console.log('[Mock State] 未找到当前登录用户'); return null; } diff --git a/src/mocks/handlers/account.js b/src/mocks/handlers/account.js index 75cc2e75..f24ab6b9 100644 --- a/src/mocks/handlers/account.js +++ b/src/mocks/handlers/account.js @@ -594,14 +594,13 @@ export const accountHandlers = [ const currentUser = getCurrentUser(); if (!currentUser) { + console.warn('[Mock API] 获取订阅详情失败: 用户未登录'); return HttpResponse.json( { success: false, error: '未登录' }, { status: 401 } ); } - console.log('[Mock] 获取当前订阅详情'); - // 基于当前用户的订阅类型返回详情 const userSubscriptionType = (currentUser.subscription_type || 'free').toLowerCase(); @@ -614,6 +613,14 @@ export const accountHandlers = [ end_date: currentUser.subscription_end_date || null }; + console.log('[Mock API] 获取当前订阅详情:', { + user_id: currentUser.id, + phone: currentUser.phone, + subscription_type: userSubscriptionType, + subscription_status: subscriptionDetails.status, + days_left: subscriptionDetails.days_left + }); + return HttpResponse.json({ success: true, data: subscriptionDetails