feat: 1. 基础设施（2个文件）
- ✅ src/utils/logger.js - 统一日志工具 - API 请求/响应/错误日志 - 组件错误/警告/调试日志 - 开发环境详细分组，生产环境仅错误 - ✅ src/utils/axiosConfig.js - axios 全局拦截器 - 自动记录所有请求/响应 - 统一 baseURL 和 credentials 配置\ 2. 核心文件重构（8个文件）\ AuthFormContent.js | ✅ 保留登录/注册成功 toast❌ 移除验证码发送 toast✅ 添加 .trim()✅ 所有 API 添加 logger | ✅ 完成 | | Center.js | ❌ 移除所有 toast✅ 移除 toast 依赖✅ 添加错误 logger | ✅ 完成 | | Community/index.js | ❌ 移除所有 toast 和导入✅ 移除 toast 依赖✅ 添加错误 logger | ✅ 完成 | | authService.js | ✅ 统一 apiRequest 函数✅ 所有请求自动记录❌ 移除 console.error | ✅ 完成 | | eventService.js | ✅ 重构 apiRequest✅ 所有方法添加 logger❌ 移除 console.log/error | ✅ 完成 | | stockService | ✅ 所有方法添加 logger❌ 移除 console 输出 | ✅ 完成 | | indexService | ✅ 添加 logger❌ 移除 console 输出 | ✅ 完成 | | AuthContext.js | ✅ 保留注册/登出成功 toast❌ 移除验证码发送 toast✅ 所有方法添加 logger | ✅ 完成 |\ 3. Mock 数据完善（\ Mock 数据完善（1个文件） - ✅ src/mocks/handlers/account.js - 个人中心 Mock - ✅ 自选股列表 (GET /api/account/watchlist) - ✅ 实时行情 (GET /api/account/watchlist/realtime) - ✅ 添加自选股 (POST /api/account/watchlist/add) - ✅ 删除自选股 (DELETE /api/account/watchlist/:id) - ✅ 关注的事件 (GET /api/account/events/following) - ✅ 事件评论 (GET /api/account/events/comments) - ✅ 当前订阅 (GET /api/subscription/current)\ 4. API 文档（1个文件） - ✅ API_ENDPOINTS.md - 完整 API 接口文档 - 认证相关: 4个接口 - 个人中心: 12个接口 - 事件相关: 12个接口 - 总计: 28+个接口\ 5。Toast 策略执行: - ✅ 保留: 3种（登录成功、注册成功、登出成功） - ❌ 移除: 15+处（验证码、数据加载等） Logger 替换: - ✅ console.log → logger.debug/logger.info - ✅ console.error → logger.error\- console.warn → logger.warn Mock 数据: 已有: auth.js, event.js, users.js, events.js 新增: account.js（7个新接口） 6.用户体验改进 静默优化:不再弹出验证码发送成功提示（静默处理）不再弹出数据加载失败提示（console 记录） 仅在关键操作显示 toast（登录/注册/登出） 开发体验: Console 中有清晰的分组日志（🌐 🔴 ⚠️ 等图标）， 所有 API 请求/响应自动记录，错误日志包含完整上下文和堆栈，Mock 服务完善 测试场景: 登录/注册 - 仅显示成功 toast，验证码静默发送 个人中心 - 加载自选股、实时行情、关注事件 社区页面 - 加载事件列表、Console 查看 9. 添加日志：API Request / ✅ API Response / ❌ API Error
This commit is contained in:
zdl
@@ -35,6 +35,7 @@ import AuthHeader from './AuthHeader';
|
||||
import VerificationCodeInput from './VerificationCodeInput';
|
||||
import WechatRegister from './WechatRegister';
|
||||
import { setCurrentUser } from '../../mocks/data/users';
|
||||
import { logger } from '../../utils/logger';
|
||||
|
||||
// 统一配置对象
|
||||
const AUTH_CONFIG = {
|
||||
@@ -151,17 +152,22 @@ export default function AuthFormContent() {
|
||||
|
||||
try {
|
||||
setSendingCode(true);
|
||||
|
||||
const requestData = {
|
||||
credential: credential.trim(), // 添加 trim() 防止空格
|
||||
type: 'phone',
|
||||
purpose: config.api.purpose
|
||||
};
|
||||
|
||||
logger.api.request('POST', '/api/auth/send-verification-code', requestData);
|
||||
|
||||
const response = await fetch('/api/auth/send-verification-code', {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
credentials: 'include', // 必须包含以支持跨域 session cookie
|
||||
body: JSON.stringify({
|
||||
credential,
|
||||
type: 'phone',
|
||||
purpose: config.api.purpose // 根据模式使用不同的purpose
|
||||
}),
|
||||
credentials: 'include',
|
||||
body: JSON.stringify(requestData),
|
||||
});
|
||||
|
||||
if (!response) {
|
||||
@@ -170,6 +176,8 @@ export default function AuthFormContent() {
|
||||
|
||||
const data = await response.json();
|
||||
|
||||
logger.api.response('POST', '/api/auth/send-verification-code', response.status, data);
|
||||
|
||||
if (!isMountedRef.current) return;
|
||||
|
||||
if (!data) {
|
||||
@@ -177,11 +185,10 @@ export default function AuthFormContent() {
|
||||
}
|
||||
|
||||
if (response.ok && data.success) {
|
||||
toast({
|
||||
title: "验证码已发送",
|
||||
description: "验证码已发送到您的手机号",
|
||||
status: "success",
|
||||
duration: 3000,
|
||||
// ❌ 移除成功 toast，静默处理
|
||||
logger.info('AuthFormContent', '验证码发送成功', {
|
||||
credential: credential.substring(0, 3) + '****' + credential.substring(7),
|
||||
dev_code: data.dev_code
|
||||
});
|
||||
setVerificationCodeSent(true);
|
||||
setCountdown(60);
|
||||
@@ -189,14 +196,10 @@ export default function AuthFormContent() {
|
||||
throw new Error(data.error || '发送验证码失败');
|
||||
}
|
||||
} catch (error) {
|
||||
if (isMountedRef.current) {
|
||||
toast({
|
||||
title: "发送验证码失败",
|
||||
description: error.message || "请稍后重试",
|
||||
status: "error",
|
||||
duration: 3000,
|
||||
});
|
||||
}
|
||||
// ❌ 移除错误 toast，仅 console 输出
|
||||
logger.api.error('POST', '/api/auth/send-verification-code', error, {
|
||||
credential: credential.substring(0, 3) + '****' + credential.substring(7)
|
||||
});
|
||||
} finally {
|
||||
if (isMountedRef.current) {
|
||||
setSendingCode(false);
|
||||
@@ -234,18 +237,24 @@ export default function AuthFormContent() {
|
||||
|
||||
// 构建请求体
|
||||
const requestBody = {
|
||||
credential: phone,
|
||||
verification_code: verificationCode,
|
||||
credential: phone.trim(), // 添加 trim() 防止空格
|
||||
verification_code: verificationCode.trim(), // 添加 trim() 防止空格
|
||||
login_type: 'phone',
|
||||
};
|
||||
|
||||
logger.api.request('POST', '/api/auth/login-with-code', {
|
||||
credential: phone.substring(0, 3) + '****' + phone.substring(7),
|
||||
verification_code: verificationCode.substring(0, 2) + '****',
|
||||
login_type: 'phone'
|
||||
});
|
||||
|
||||
// 调用API（根据模式选择不同的endpoint
|
||||
const response = await fetch('/api/auth/login-with-code', {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
credentials: 'include', // 必须包含以支持跨域 session cookie
|
||||
credentials: 'include',
|
||||
body: JSON.stringify(requestBody),
|
||||
});
|
||||
|
||||
@@ -255,6 +264,11 @@ export default function AuthFormContent() {
|
||||
|
||||
const data = await response.json();
|
||||
|
||||
logger.api.response('POST', '/api/auth/login-with-code', response.status, {
|
||||
...data,
|
||||
user: data.user ? { id: data.user.id, phone: data.user.phone } : null
|
||||
});
|
||||
|
||||
if (!isMountedRef.current) return;
|
||||
|
||||
if (!data) {
|
||||
@@ -271,13 +285,19 @@ export default function AuthFormContent() {
|
||||
// 更新session
|
||||
await checkSession();
|
||||
|
||||
// ✅ 保留登录成功 toast（关键操作提示）
|
||||
toast({
|
||||
title: config.successTitle,
|
||||
title: data.isNewUser ? '注册成功' : '登录成功',
|
||||
description: config.successDescription,
|
||||
status: "success",
|
||||
duration: 2000,
|
||||
});
|
||||
|
||||
logger.info('AuthFormContent', '登录成功', {
|
||||
isNewUser: data.isNewUser,
|
||||
userId: data.user?.id
|
||||
});
|
||||
|
||||
// 检查是否为新注册用户
|
||||
if (data.isNewUser) {
|
||||
// 新注册用户，延迟后显示昵称设置引导
|
||||
@@ -295,15 +315,12 @@ export default function AuthFormContent() {
|
||||
throw new Error(data.error || `${config.errorTitle}`);
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('Auth error:', error);
|
||||
if (isMountedRef.current) {
|
||||
toast({
|
||||
title: config.errorTitle,
|
||||
description: error.message || "请稍后重试",
|
||||
status: "error",
|
||||
duration: 3000,
|
||||
});
|
||||
}
|
||||
// ❌ 移除错误 toast，仅 console 输出
|
||||
const { phone, verificationCode } = formData;
|
||||
logger.error('AuthFormContent', 'handleSubmit', error, {
|
||||
phone: phone ? phone.substring(0, 3) + '****' + phone.substring(7) : 'N/A',
|
||||
hasVerificationCode: !!verificationCode
|
||||
});
|
||||
} finally {
|
||||
if (isMountedRef.current) {
|
||||
setIsLoading(false);
|
||||
|
||||
Reference in New Issue
Block a user