fix: 修复导航栏 Max 会员订阅信息显示问题
- 修复 HomeNavbar 中 useEffect 执行顺序导致订阅信息不加载的问题 - 移除 ref 检查逻辑,改为直接根据登录状态加载订阅信息 - 增强订阅相关的调试日志输出(getCurrentUser, API handler, HomeNavbar) - 优化用户数据获取的日志格式,便于问题排查
This commit is contained in:
@@ -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 (
|
||||
<>
|
||||
|
||||
@@ -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;
|
||||
}
|
||||
|
||||
|
||||
@@ -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
|
||||
|
||||
Reference in New Issue
Block a user