fix(wxapp): 修复首页分享链接白屏问题

- 添加邀请关系处理的超时保护,避免长时间等待
- 优化 API调用流程,增加错误处理机制
- 改进页面加载逻辑,确保主要内容优先显示
- 新增失败重试计数,防止无限重试
- 清理邀请参数缓存,避免重复处理
This commit is contained in:
2025-09-01 20:40:08 +08:00
parent 7a7d8b4605
commit 2c31f2a6d7
6 changed files with 590 additions and 45 deletions

View File

@@ -0,0 +1,142 @@
# 首页分享链接白屏问题测试
## ✅ 编译成功
项目已成功编译没有TypeScript错误。现在可以开始测试。
## 🧪 立即测试步骤
### 1. 启动开发环境
```bash
npm run dev:weapp
```
### 2. 测试首页分享功能
#### 步骤A创建分享链接
1. 在微信开发者工具中打开小程序
2. 进入首页pages/index/index
3. 点击右上角的分享按钮
4. 选择"分享给朋友"
5. 复制生成的分享链接
#### 步骤B从分享链接进入
1. 关闭当前小程序
2. 从分享链接重新进入
3. **观察加载过程**
### 3. 预期结果对比
#### ❌ 修复前(问题状态)
- 页面显示"加载中..."
- 长时间白屏
- 无法正常显示内容
- 用户无法操作
#### ✅ 修复后(正常状态)
- 页面正常加载
- 邀请关系在后台处理(不阻塞页面)
- 即使邀请处理失败,页面仍正常显示
- 控制台有相关日志输出
### 4. 关键日志监控
在微信开发者工具的控制台中,应该看到:
```
=== 小程序启动参数处理开始 ===
完整启动参数: {...}
检测到待处理的邀请关系
使用用户ID处理邀请关系: [用户ID]
首页邀请关系处理成功 (或失败但不影响页面)
=== 小程序启动参数处理结束 ===
```
### 5. 特殊场景测试
#### 场景1网络异常测试
1. 在开发者工具中设置网络为"离线"
2. 从首页分享链接进入
3. **预期**:页面应该能显示基本内容,邀请处理超时后不影响页面
#### 场景2邀请API失败测试
1. 暂时修改邀请API地址为无效地址
2. 从分享链接进入
3. **预期**:邀请处理失败,但页面正常显示
### 6. 性能验证
#### 加载时间测试
- **目标**首页应在3秒内完成基本加载
- **方法**:在控制台查看加载时间日志
- **标准**:即使邀请处理失败,页面也应快速显示
### 7. 问题排查
如果仍有问题,请检查:
#### 检查1清理缓存
```bash
# 在微信开发者工具中
# 点击"清缓存" -> "清除全部缓存"
# 然后重新编译
npm run build:weapp
```
#### 检查2查看具体错误
在控制台中执行:
```javascript
// 查看邀请参数
console.log('邀请参数:', Taro.getStorageSync('invite_params'))
// 查看用户登录状态
console.log('用户ID:', Taro.getStorageSync('UserId'))
console.log('访问令牌:', Taro.getStorageSync('access_token'))
// 手动测试邀请处理
import { checkAndHandleInviteRelation } from '@/utils/invite'
checkAndHandleInviteRelation().then(result => {
console.log('手动处理结果:', result)
}).catch(error => {
console.log('手动处理错误:', error)
})
```
#### 检查3API状态
在网络面板中查看:
- `/api/wx-login/loginByOpenId` 请求状态
- `/shop/shop-dealer-referee` 请求状态
- 是否有请求超时或失败
### 8. 成功验证清单
- [ ] **基础功能**
- [ ] 首页分享链接可以正常打开
- [ ] 页面内容正常显示
- [ ] 不出现长时间白屏
- [ ] **邀请功能**
- [ ] 邀请参数正常解析
- [ ] 邀请关系处理不阻塞页面
- [ ] 处理失败时有合适的日志
- [ ] **错误处理**
- [ ] 网络异常时页面仍可访问
- [ ] 超时保护机制正常工作
- [ ] 错误日志清晰明确
- [ ] **性能表现**
- [ ] 页面加载时间合理
- [ ] 用户体验流畅
- [ ] 内存使用正常
## 🎯 测试结论
如果以上测试都通过,说明首页分享链接白屏问题已经解决。
如果仍有问题,请提供:
1. 具体的错误信息
2. 控制台完整日志
3. 网络请求状态
4. 复现的具体步骤
这样我可以进一步诊断和修复。