From a829a66947d5c5378e766db12ceea7079028992e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=BC=A0=E6=88=90?= Date: Sun, 7 Sep 2025 22:40:47 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E9=AA=8C=E8=AF=81=E7=A0=81?= =?UTF-8?q?=E7=99=BB=E9=99=86=E9=80=BB=E8=BE=91?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/config/env.ts | 8 +- src/pages/login/README.md | 312 ----------------------- src/pages/login/api .md | 95 ------- src/pages/login/login_flow.md | 179 ------------- src/pages/login/login_test.md | 333 ------------------------- src/pages/login/verification/index.tsx | 26 +- src/services/loginService.ts | 24 +- 7 files changed, 29 insertions(+), 948 deletions(-) delete mode 100644 src/pages/login/README.md delete mode 100644 src/pages/login/api .md delete mode 100644 src/pages/login/login_flow.md delete mode 100644 src/pages/login/login_test.md diff --git a/src/config/env.ts b/src/config/env.ts index 9a1dca2..a6853ac 100644 --- a/src/config/env.ts +++ b/src/config/env.ts @@ -17,8 +17,8 @@ const envConfigs: Record = { // 开发环境 development: { name: '开发环境', - apiBaseURL: 'https://sit.light120.com', - // apiBaseURL: 'http://localhost:9098', + //apiBaseURL: 'https://sit.light120.com', + apiBaseURL: 'http://localhost:9098', timeout: 15000, enableLog: true, enableMock: true @@ -27,8 +27,8 @@ const envConfigs: Record = { // 测试环境 test: { name: '测试环境', - apiBaseURL: 'https://sit.light120.com', - // apiBaseURL: 'http://localhost:9098', + // apiBaseURL: 'https://sit.light120.com', + apiBaseURL: 'http://localhost:9098', timeout: 12000, enableLog: true, enableMock: false diff --git a/src/pages/login/README.md b/src/pages/login/README.md deleted file mode 100644 index b204adb..0000000 --- a/src/pages/login/README.md +++ /dev/null @@ -1,312 +0,0 @@ -# 登录页面 - 基于 Figma 设计稿 - -## 设计概述 - -本登录页面完全按照 Figma 设计稿 `EWQlX5wM2lhiSLfFQp8qKT` 实现，具有以下特色： - -## 🎨 设计特点 - -### 视觉设计 -- **背景图片**：使用运动主题的背景图片，带有渐变遮罩效果 -- **品牌元素**："有场" Logo 配合运动图标，体现约球应用定位 -- **英文标语**："Go Together Grow Together" 传达社交运动理念 -- **状态栏**：完全还原 iPhone 状态栏样式 - -### 交互设计 -- **双登录方式**：微信快捷登录（主要）+ 手机号验证码登录（备选） -- **用户协议**：必须勾选同意协议才能登录 -- **视觉反馈**：按钮加载状态、动画效果 -- **毛玻璃效果**：按钮使用 backdrop-filter 实现现代化视觉效果 - -## 📱 页面结构 - -``` -LoginPage -├── 背景图片层 -│ ├── 运动背景图片 -│ └── 渐变遮罩层 -├── 状态栏 -│ ├── 时间显示 (9:41) -│ └── 状态图标 (信号/WiFi/电池) -├── 主要内容 -│ ├── 品牌区域 -│ │ ├── "有场" Logo + 图标 -│ │ └── 英文标语 -│ └── 登录区域 -│ ├── 微信快捷登录按钮 -│ ├── 手机号验证码登录按钮 -│ └── 用户协议选择 -└── 底部指示器 -``` - -## 🚀 功能特性 - -### 登录方式 - -#### 1. 微信快捷登录 -- **视觉样式**：白色背景，微信绿色图标，毛玻璃效果 -- **功能流程**： - 1. 检查用户协议同意状态 - 2. 调用 `Taro.login()` 获取微信 code - 3. 调用 `Taro.getUserProfile()` 获取用户信息 - 4. 保存登录状态并跳转到首页 - -#### 2. 手机号验证码登录 -- **视觉样式**：半透明背景，白色图标和文字 -- **当前状态**：显示开发中提示（可扩展为完整功能） - -### 用户协议 -- **必须勾选**：未勾选时禁止登录并提示 -- **协议条款**： - - 《开场的条款和条件》 - - 《开场与微信号绑定协议》 - - 《隐私权政策》 -- **交互方式**：点击查看具体协议内容 - -## 🛠 技术实现 - -### 状态管理 -- `is_loading`: 控制登录按钮加载状态 -- `agree_terms`: 用户协议同意状态 - -### 核心方法 -- `handle_wechat_login()`: 微信登录流程 -- `handle_phone_login()`: 手机号登录（待实现） -- `handle_agree_terms()`: 协议同意状态切换 -- `handle_view_terms()`: 查看协议详情 - -### 样式特色 -- **毛玻璃效果**：`backdrop-filter: blur(32px)` -- **渐变背景**：`linear-gradient(180deg, rgba(0,0,0,0) 48%, rgba(0,0,0,0.96) 86%, rgba(0,0,0,1) 100%)` -- **微信绿色**：`#07C160` 和渐变色 -- **动画效果**：`fadeInUp` 入场动画 - -## 📂 文件结构 - -``` -src/pages/login/ -├── index.tsx # 登录页面组件 -├── index.scss # Figma 设计稿样式 -├── index.config.ts # 页面配置 -├── verification/ # 验证码页面 -├── terms/ # 协议详情页面 -├── README.md # 说明文档 -├── login_flow.md # 登录流程串接说明 -├── login_test.md # 测试配置文档 -└── api .md # API 接口文档 -``` - -## 🔧 配置说明 - -### 页面配置 -```typescript -export default definePageConfig({ - navigationBarTitleText: '登录', - navigationBarBackgroundColor: '#ffffff', - navigationBarTextStyle: 'black', - backgroundColor: '#f5f5f5', - enablePullDownRefresh: false, - disableScroll: false -}) -``` - -### 应用配置 -登录页面已设置为应用入口页面，在 `app.config.ts` 中位于页面列表首位。 - -## 🎯 设计还原度 - -### 完全还原的元素 -- ✅ 背景图片和渐变效果 -- ✅ "有场" Logo 和品牌标语 -- ✅ 微信登录按钮样式和图标 -- ✅ 手机号登录按钮样式 -- ✅ 用户协议复选框和文本 -- ✅ 状态栏布局和样式 -- ✅ 底部指示器 - -### 响应式适配 -- 支持不同屏幕尺寸 -- 保持设计稿比例和布局 -- 动画效果和交互反馈 - -## 🔄 后续扩展 - -### 可扩展功能 -1. **手机号登录完整流程** - - 手机号输入页面 - - 验证码发送和验证 - - 登录状态保存 - -2. **第三方登录** - - QQ 登录 - - 支付宝登录 - - Apple ID 登录 - -3. **用户协议页面** - - 协议详情展示页面 - - 协议更新通知机制 - -### 多协议支持 -- **三个协议链接**：每个协议都可以独立点击 - - 《开场的条款和条件》 - - 《开场与微信号绑定协议》 - - 《隐私权政策》 -- **动态内容显示**：根据协议类型显示对应内容 -- **页面标题适配**：自动根据协议类型设置页面标题 -- **URL 参数传递**：支持通过 URL 参数指定协议类型 - -### 性能优化 -- 图片资源压缩和 lazy loading -- 动画性能优化 -- 登录状态缓存策略 - -## 📱 测试说明 - -### 微信登录测试 -1. 必须在微信小程序环境中测试 -2. 需要配置正确的小程序 AppID -3. 用户首次使用需要授权头像和昵称 - -### 开发环境测试 -- 可以使用微信开发者工具模拟器 -- 注意模拟器中的 `getUserProfile` 行为可能与真机不同 - -## 🎨 设计源文件 - -**Figma 设计稿链接**： -https://www.figma.com/design/EWQlX5wM2lhiSLfFQp8qKT/小程序设计稿V1（开发协作版）?node-id=3043-3055 - -设计稿包含了完整的视觉规范、尺寸标注和交互说明，本实现严格按照设计稿要求进行开发。 - ---- - -## 🔗 登录流程串接说明 - -### 📋 流程概述 - -登录系统已完全串接，支持两种登录方式： - -1. **微信快捷登录** - 主要登录方式，调用真实后端接口 -2. **手机号验证码登录** - 备选登录方式，完整的验证码流程 - -### 🔄 完整流程 - -#### 微信快捷登录流程 -``` -用户点击微信登录 → 检查协议同意 → 获取微信code → 调用后端接口 → 保存登录状态 → 跳转首页 -``` - -#### 手机号验证码登录流程 -``` -用户点击手机号登录 → 跳转验证码页面 → 输入手机号 → 发送验证码 → 输入验证码 → 验证登录 → 跳转首页 -``` - -### 🌐 API 接口集成 - -已集成以下真实后端接口： - -- **微信授权**: `POST /api/user/wx_auth` -- **发送短信**: `POST /api/user/sms/send` -- **验证验证码**: `POST /api/user/sms/verify` - -### 📱 页面跳转关系 - -``` -登录主页 (/pages/login/index/index) - ↓ -验证码页面 (/pages/login/verification/index) - ↓ -协议详情页面 (/pages/login/terms/index) - ↓ -应用首页 (/pages/list/index) -``` - -### 🧪 测试配置 - -- **测试环境**: `https://sit.light120.com/api` -- **测试账号**: `13800138000` / `123456` -- **完整测试用例**: 参考 `login_test.md` - -### 📚 相关文档 - -- **流程说明**: `login_flow.md` - 详细的流程和接口说明 -- **测试配置**: `login_test.md` - 完整的测试用例和配置 -- **API 文档**: `api .md` - 后端接口规范 - -### ✅ 完成状态 - -- ✅ 微信快捷登录流程 -- ✅ 手机号验证码登录流程 -- ✅ 用户协议流程 -- ✅ 真实后端接口集成 -- ✅ 错误处理和用户提示 -- ✅ 登录状态管理 -- ✅ 页面跳转逻辑 - -登录系统已完全串接完成，可以直接进行功能测试和上线使用。 - ---- - -## 🚀 HTTP 服务集成 - -### 🔧 技术架构 - -登录服务现在使用 `src/services/httpService.ts` 中封装好的请求方法，实现了更完善的 HTTP 请求管理： - -#### 核心特性 -- **统一请求管理**: 使用 `httpService.post()` 方法进行所有 API 调用 -- **自动错误处理**: 自动处理网络错误、HTTP 状态码错误和业务逻辑错误 -- **智能 Token 管理**: 自动添加认证 Token，支持过期自动刷新 -- **环境配置支持**: 自动使用环境配置中的 API 地址和超时设置 -- **加载状态管理**: 支持自动显示/隐藏加载提示 -- **模拟模式支持**: 开发环境下支持模拟数据返回 - -#### 使用方式 -```typescript -// 微信授权登录 -const auth_response = await httpService.post('/user/wx_auth', { - code: login_result.code -}); - -// 发送短信验证码 -const response = await httpService.post('/user/sms/send', { - phone: phone -}); - -// 验证短信验证码 -const verify_response = await httpService.post('/user/sms/verify', { - phone: phone, - code: code -}); -``` - -### 🌍 环境配置 - -HTTP 服务通过 `src/config/env.ts` 进行环境配置： - -- **开发环境**: 自动使用开发环境配置 -- **测试环境**: 支持测试环境 API 地址 -- **生产环境**: 支持生产环境 API 地址 -- **模拟模式**: 开发环境下可启用模拟数据 - -### 🛡️ 安全特性 - -- **请求头安全**: 自动设置安全的请求头 -- **Token 验证**: 自动验证和刷新认证 Token -- **错误信息保护**: 防止敏感错误信息泄露 -- **请求频率控制**: 支持请求频率限制 - -### 📊 监控和日志 - -- **请求日志**: 详细的请求和响应日志记录 -- **性能监控**: 请求响应时间监控 -- **错误追踪**: 完整的错误堆栈和上下文信息 -- **环境信息**: 当前环境配置信息输出 - -### 🔄 向后兼容 - -- **接口响应格式**: 保持原有的响应格式兼容性 -- **错误处理**: 保持原有的错误处理逻辑 -- **状态管理**: 保持原有的登录状态管理逻辑 - -登录系统现在使用更加健壮和可维护的 HTTP 服务架构，提供了更好的开发体验和运行稳定性。 \ No newline at end of file diff --git a/src/pages/login/api .md b/src/pages/login/api .md deleted file mode 100644 index 46c8d73..0000000 --- a/src/pages/login/api .md +++ /dev/null @@ -1,95 +0,0 @@ - -// 授权接口 - -fetch("https://sit.light120.com/api/user/wx_auth", { - "headers": { - "accept": "application/json", - "accept-language": "zh-CN,zh;q=0.9", - "content-type": "application/json", - "priority": "u=1, i", - "sec-ch-ua": "\"Chromium\";v=\"134\", \"Not:A-Brand\";v=\"24\", \"Google Chrome\";v=\"134\"", - "sec-ch-ua-mobile": "?0", - "sec-ch-ua-platform": "\"Windows\"", - "sec-fetch-dest": "empty", - "sec-fetch-mode": "cors", - "sec-fetch-site": "same-origin" - }, - "referrer": "https://sit.light120.com/api/docs", - "referrerPolicy": "strict-origin-when-cross-origin", - "body": "{\n \"code\": \"string\"\n}", - "method": "POST", - "mode": "cors", - "credentials": "omit" -}); - - -// 用户手机号一键登录登陆 - fetch("https://sit.light120.com/api/user/phone_verify", { - "headers": { - "accept": "application/json", - "accept-language": "zh-CN,zh;q=0.9", - "content-type": "application/json", - "priority": "u=1, i", - "sec-ch-ua": "\"Chromium\";v=\"134\", \"Not:A-Brand\";v=\"24\", \"Google Chrome\";v=\"134\"", - "sec-ch-ua-mobile": "?0", - "sec-ch-ua-platform": "\"Windows\"", - "sec-fetch-dest": "empty", - "sec-fetch-mode": "cors", - "sec-fetch-site": "same-origin" - }, - "referrer": "https://sit.light120.com/api/docs", - "referrerPolicy": "strict-origin-when-cross-origin", - "body": "{\n \"code\": \"string\"\n}", - "method": "POST", - "mode": "cors", - "credentials": "omit" -}); - - - -// 发送短信 - -fetch("https://sit.light120.com/api/user/sms/send", { - "headers": { - "accept": "application/json", - "accept-language": "zh-CN,zh;q=0.9", - "content-type": "application/json", - "priority": "u=1, i", - "sec-ch-ua": "\"Chromium\";v=\"134\", \"Not:A-Brand\";v=\"24\", \"Google Chrome\";v=\"134\"", - "sec-ch-ua-mobile": "?0", - "sec-ch-ua-platform": "\"Windows\"", - "sec-fetch-dest": "empty", - "sec-fetch-mode": "cors", - "sec-fetch-site": "same-origin" - }, - "referrer": "https://sit.light120.com/api/docs", - "referrerPolicy": "strict-origin-when-cross-origin", - "body": "{\n \"phone\": \"13122585075\"\n}", - "method": "POST", - "mode": "cors", - "credentials": "omit" -}); - - -// 验证验证码接口 - -fetch("https://sit.light120.com/api/user/sms/verify", { - "headers": { - "accept": "application/json", - "accept-language": "zh-CN,zh;q=0.9", - "content-type": "application/json", - "priority": "u=1, i", - "sec-ch-ua": "\"Chromium\";v=\"134\", \"Not:A-Brand\";v=\"24\", \"Google Chrome\";v=\"134\"", - "sec-ch-ua-mobile": "?0", - "sec-ch-ua-platform": "\"Windows\"", - "sec-fetch-dest": "empty", - "sec-fetch-mode": "cors", - "sec-fetch-site": "same-origin" - }, - "referrer": "https://sit.light120.com/api/docs", - "referrerPolicy": "strict-origin-when-cross-origin", - "body": "{\n \"phone\": \"13800138000\",\n \"code\": \"123456\"\n}", - "method": "POST", - "mode": "cors", - "credentials": "omit" -}); \ No newline at end of file diff --git a/src/pages/login/login_flow.md b/src/pages/login/login_flow.md deleted file mode 100644 index 043a7ca..0000000 --- a/src/pages/login/login_flow.md +++ /dev/null @@ -1,179 +0,0 @@ -# 登录页面流程串接说明 - -## 整体流程概述 - -登录系统支持两种登录方式： -1. **微信快捷登录** - 主要登录方式 -2. **手机号验证码登录** - 备选登录方式 - -## 流程详细说明 - -### 1. 微信快捷登录流程 - -``` -用户点击微信登录按钮 - ↓ -检查用户协议是否同意 - ↓ (未同意则显示协议浮层) -调用 Taro.login() 获取微信 code - ↓ -调用 Taro.getUserProfile() 获取用户信息 - ↓ -使用 httpService.post() 调用后端接口 /api/user/wx_auth - ↓ -保存登录状态到本地存储 - ↓ -跳转到首页 /pages/list/index -``` - -**接口调用**： -- **方法**: `httpService.post('/user/wx_auth', { code: '微信登录返回的code' })` -- **URL**: `POST https://sit.light120.com/api/user/wx_auth` -- **参数**: `{ "code": "微信登录返回的code" }` -- **响应**: 包含 token 和用户信息的登录成功响应 - -### 2. 手机号验证码登录流程 - -``` -用户点击手机号登录按钮 - ↓ -跳转到验证码页面 /pages/login/verification/index - ↓ -用户输入手机号 - ↓ -点击发送验证码按钮 - ↓ -使用 httpService.post() 调用后端接口 /api/user/sms/send - ↓ -用户输入收到的验证码 - ↓ -点击登录按钮 - ↓ -使用 httpService.post() 调用后端接口 /api/user/sms/verify - ↓ -验证成功后保存登录状态 - ↓ -跳转到首页 /pages/list/index -``` - -**接口调用**： - -#### 发送短信验证码 -- **方法**: `httpService.post('/user/sms/send', { phone: '手机号码' })` -- **URL**: `POST https://sit.light120.com/api/user/sms/send` -- **参数**: `{ "phone": "手机号码" }` -- **响应**: 发送成功或失败的响应 - -#### 验证短信验证码 -- **方法**: `httpService.post('/user/sms/verify', { phone: '手机号码', code: '验证码' })` -- **URL**: `POST https://sit.light120.com/api/user/sms/verify` -- **参数**: `{ "phone": "手机号码", "code": "验证码" }` -- **响应**: 验证成功或失败的响应，成功时包含 token 和用户信息 - -### 3. 用户协议流程 - -``` -用户首次进入登录页面 - ↓ -显示协议浮层，要求用户同意 - ↓ -用户点击协议链接查看详情 - ↓ -跳转到协议页面 /pages/login/terms/index - ↓ -用户返回登录页面 - ↓ -勾选同意协议复选框 - ↓ -协议浮层消失，可以正常登录 -``` - -**协议类型**： -- `terms` - 《开场的条款和条件》 -- `binding` - 《开场与微信号绑定协议》 -- `privacy` - 《隐私权政策》 - -## 技术实现要点 - -### 1. HTTP 服务集成 - -登录服务现在使用 `httpService.ts` 中封装好的请求方法： - -- **统一请求**: 使用 `httpService.post()` 方法 -- **自动处理**: 自动处理请求头、错误处理、加载状态等 -- **环境配置**: 自动使用环境配置中的 API 地址 -- **Token 管理**: 自动处理认证 Token 的添加和刷新 - -### 2. 状态管理 -- `is_loading`: 控制登录按钮加载状态 -- `agree_terms`: 用户协议同意状态 -- `show_terms_layer`: 协议浮层显示状态 - -### 3. 错误处理 -- 网络请求失败时的友好提示 -- 验证码错误时的重试机制 -- 微信授权失败时的降级处理 -- 使用 httpService 的统一错误处理 - -### 4. 本地存储 -- `user_token`: 用户登录令牌 -- `user_info`: 用户基本信息 -- `is_logged_in`: 登录状态标识 -- `login_time`: 登录时间戳 - -### 5. 安全考虑 -- 验证码倒计时防止重复发送 -- 登录状态过期检查（7天） -- 敏感信息不存储在本地 -- 使用 httpService 的 Token 验证机制 - -## 页面跳转关系 - -``` -/pages/login/index/index (登录主页) - ↓ -/pages/login/verification/index (验证码页面) - ↓ -/pages/login/terms/index (协议详情页面) - ↓ -/pages/list/index (应用首页) -``` - -## 接口响应格式 - -### 成功响应 -```json -{ - "success": true, - "message": "操作成功", - "data": { - "token": "用户登录令牌", - "user_info": { - "user_id": "用户ID", - "username": "用户名", - "avatar": "头像URL", - "gender": 0, - "city": "城市", - "province": "省份", - "country": "国家" - } - } -} -``` - -### 失败响应 -```json -{ - "success": false, - "message": "错误信息描述" -} -``` - -## 开发注意事项 - -1. **环境配置**: 确保 envConfig.apiBaseURL 指向正确的环境 -2. **错误处理**: httpService 自动处理大部分错误情况 -3. **用户体验**: 加载状态、倒计时、提示信息等交互细节 -4. **兼容性**: 支持不同版本的微信小程序 -5. **测试**: 在真机和模拟器中测试各种场景 -6. **Token 管理**: 使用 httpService 的自动 Token 管理功能 \ No newline at end of file diff --git a/src/pages/login/login_test.md b/src/pages/login/login_test.md deleted file mode 100644 index 73bb583..0000000 --- a/src/pages/login/login_test.md +++ /dev/null @@ -1,333 +0,0 @@ -# 登录流程测试配置 - -## 测试环境配置 - -### API 接口地址 -- **测试环境**: `https://sit.light120.com/api` -- **生产环境**: `https://light120.com/api` (待配置) - -### HTTP 服务配置 -- **基础 URL**: 通过 `envConfig.apiBaseURL` 配置 -- **超时时间**: 通过 `envConfig.timeout` 配置 -- **日志开关**: 通过 `envConfig.enableLog` 配置 -- **模拟模式**: 通过 `envConfig.enableMock` 配置 - -### 测试账号信息 -- **测试手机号**: `13800138000` -- **测试验证码**: `123456` (仅用于开发测试) - -## 测试场景 - -### 1. 微信快捷登录测试 - -#### 正常流程测试 -1. 进入登录页面 -2. 勾选同意用户协议 -3. 点击"微信快捷登录"按钮 -4. 验证微信授权弹窗 -5. 确认授权后检查登录成功 -6. 验证跳转到首页 - -#### 异常情况测试 -1. **未同意协议**: 点击登录按钮应显示协议浮层 -2. **微信授权失败**: 模拟网络错误，检查错误提示 -3. **登录接口异常**: 模拟后端接口返回错误 -4. **HTTP 服务异常**: 测试 httpService 的错误处理 - -### 2. 手机号验证码登录测试 - -#### 正常流程测试 -1. 进入登录页面 -2. 点击"手机号验证码登录"按钮 -3. 跳转到验证码页面 -4. 输入手机号 `13800138000` -5. 点击"获取验证码"按钮 -6. 输入验证码 `123456` -7. 点击"登录"按钮 -8. 验证登录成功并跳转 - -#### 异常情况测试 -1. **手机号格式错误**: 输入非11位数字 -2. **验证码格式错误**: 输入非6位数字 -3. **发送验证码失败**: 模拟网络错误 -4. **验证码错误**: 输入错误验证码 -5. **登录接口异常**: 模拟后端接口返回错误 -6. **HTTP 服务异常**: 测试 httpService 的错误处理 - -### 3. 用户协议流程测试 - -#### 协议查看测试 -1. 点击任意协议链接 -2. 验证跳转到对应协议页面 -3. 检查协议内容显示 -4. 返回登录页面 - -#### 协议同意测试 -1. 未勾选协议时尝试登录 -2. 验证协议浮层显示 -3. 勾选协议复选框 -4. 验证浮层消失 -5. 再次尝试登录 - -### 4. HTTP 服务集成测试 - -#### 请求方法测试 -1. **POST 请求**: 验证 `httpService.post()` 方法 -2. **错误处理**: 验证 httpService 的统一错误处理 -3. **Token 管理**: 验证自动 Token 添加和刷新 -4. **加载状态**: 验证自动加载提示显示 - -#### 环境配置测试 -1. **开发环境**: 验证开发环境配置 -2. **测试环境**: 验证测试环境配置 -3. **模拟模式**: 验证模拟数据返回 - -## 接口测试用例 - -### 1. 微信授权接口测试 - -```bash -# 测试接口: POST /api/user/wx_auth -curl -X POST https://sit.light120.com/api/user/wx_auth \ - -H "Content-Type: application/json" \ - -d '{"code": "test_wx_code"}' -``` - -**预期响应**: -```json -{ - "success": true, - "message": "微信登录成功", - "data": { - "token": "wx_token_1234567890", - "user_info": { - "user_id": "wx_user_123", - "username": "测试用户", - "avatar": "https://example.com/avatar.jpg", - "gender": 1, - "city": "深圳", - "province": "广东", - "country": "中国" - } - } -} -``` - -### 2. 发送短信接口测试 - -```bash -# 测试接口: POST /api/user/sms/send -curl -X POST https://sit.light120.com/api/user/sms/send \ - -H "Content-Type: application/json" \ - -d '{"phone": "13800138000"}' -``` - -**预期响应**: -```json -{ - "success": true, - "message": "验证码发送成功" -} -``` - -### 3. 验证验证码接口测试 - -```bash -# 测试接口: POST /api/user/sms/verify -curl -X POST https://sit.light120.com/api/user/sms/verify \ - -H "Content-Type: application/json" \ - -d '{"phone": "13800138000", "code": "123456"}' -``` - -**预期响应**: -```json -{ - "success": true, - "message": "验证成功", - "data": { - "token": "phone_token_1234567890", - "user_info": { - "user_id": "phone_user_123", - "username": "用户8000", - "avatar": "", - "gender": 0, - "city": "", - "province": "", - "country": "" - } - } -} -``` - -## 错误响应测试 - -### 1. 验证码错误 -```bash -curl -X POST https://sit.light120.com/api/user/sms/verify \ - -H "Content-Type: application/json" \ - -d '{"phone": "13800138000", "code": "000000"}' -``` - -**预期响应**: -```json -{ - "success": false, - "message": "验证码错误" -} -``` - -### 2. 手机号格式错误 -```bash -curl -X POST https://sit.light120.com/api/user/sms/send \ - -H "Content-Type: application/json" \ - -d '{"phone": "138001380"}' -``` - -**预期响应**: -```json -{ - "success": false, - "message": "手机号格式错误" -} -``` - -## HTTP 服务测试 - -### 1. 请求头测试 -- 验证 `Content-Type` 自动设置 -- 验证认证 Token 自动添加 -- 验证自定义请求头支持 - -### 2. 错误处理测试 -- 网络连接失败处理 -- HTTP 状态码错误处理 -- 业务逻辑错误处理 -- Token 过期自动处理 - -### 3. 加载状态测试 -- 请求开始时显示加载提示 -- 请求结束时隐藏加载提示 -- 自定义加载文本支持 - -## 性能测试 - -### 1. 接口响应时间 -- **微信授权**: 期望 < 2秒 -- **发送短信**: 期望 < 1秒 -- **验证验证码**: 期望 < 1秒 - -### 2. 并发测试 -- 同时发送多个验证码请求 -- 同时进行多个登录操作 -- 验证系统稳定性 - -### 3. HTTP 服务性能 -- 请求队列处理 -- 超时处理机制 -- 错误重试机制 - -## 兼容性测试 - -### 1. 微信版本兼容 -- 微信 7.0.0+ 版本 -- 微信 8.0.0+ 版本 -- 最新版本微信 - -### 2. 设备兼容 -- iPhone 各型号 -- Android 各品牌 -- 不同屏幕尺寸 - -### 3. 网络环境兼容 -- WiFi 环境 -- 4G/5G 环境 -- 弱网环境 - -## 安全测试 - -### 1. 输入验证 -- SQL 注入防护 -- XSS 攻击防护 -- 手机号格式验证 - -### 2. 接口安全 -- 请求频率限制 -- 验证码有效期 -- Token 安全性 - -### 3. HTTP 服务安全 -- 请求头安全 -- 参数验证 -- 错误信息泄露防护 - -## 测试工具 - -### 1. 接口测试 -- Postman -- curl 命令行 -- 微信开发者工具 - -### 2. 性能测试 -- 浏览器开发者工具 -- 微信开发者工具性能面板 - -### 3. 兼容性测试 -- 真机测试 -- 模拟器测试 -- 不同微信版本测试 - -### 4. HTTP 服务测试 -- 网络调试工具 -- 环境配置测试 -- 模拟模式测试 - -## 测试报告模板 - -### 测试结果记录 -``` -测试日期: _____________ -测试人员: _____________ -测试环境: _____________ - -测试项目: -□ 微信快捷登录 -□ 手机号验证码登录 -□ 用户协议流程 -□ 接口功能测试 -□ HTTP 服务集成测试 -□ 性能测试 -□ 兼容性测试 -□ 安全测试 - -测试结果: -□ 全部通过 -□ 部分通过 -□ 未通过 - -问题记录: -1. ________________ -2. ________________ -3. ________________ - -修复建议: -________________ -________________ -``` - -### HTTP 服务测试结果 -``` -HTTP 服务测试: -□ 基础请求功能 -□ 错误处理机制 -□ Token 管理功能 -□ 加载状态管理 -□ 环境配置支持 -□ 模拟模式支持 - -配置验证: -□ 开发环境配置 -□ 测试环境配置 -□ 生产环境配置 -□ 超时配置 -□ 日志配置 -``` \ No newline at end of file diff --git a/src/pages/login/verification/index.tsx b/src/pages/login/verification/index.tsx index ddc0c21..03f7680 100644 --- a/src/pages/login/verification/index.tsx +++ b/src/pages/login/verification/index.tsx @@ -119,20 +119,26 @@ const VerificationPage: React.FC = () => { setIsLoading(true); try { - // 调用登录服务 - // debugger; - const result = await phone_auth_login({ phone, verification_code }); + + // 先进行微信登录获取code + const login_result = await Taro.login(); + + if (!login_result.code) { + return { + success: false, + message: '微信登录失败' + }; + } + + const result = await phone_auth_login({ phone, verification_code, user_code: login_result.code }); if (result.success) { save_login_state(result.token!, result.user_info!) + debugger setTimeout(() => { - if (redirect) { - Taro.redirectTo({ url: decodeURIComponent(redirect) }); - } else { - Taro.redirectTo({ - url: '/pages/list/index' - }); - } + Taro.redirectTo({ + url: '/pages/list/index' + }); }, 200); } else { Taro.showToast({ diff --git a/src/services/loginService.ts b/src/services/loginService.ts index e72b175..dae61f7 100644 --- a/src/services/loginService.ts +++ b/src/services/loginService.ts @@ -101,6 +101,7 @@ export const wechat_auth_login = async (phone_code?: string): Promise => { console.error('发送短信失败:', error); return { success: false, - message: '网络错误，请稍后重试' + message: error.message }; } }; @@ -188,7 +182,7 @@ export const verify_sms_code = async (phone: string, code: string): Promise