forked from gxwebsoft/mp-10550
fix(wxapp): 修复首页分享链接白屏问题
- 添加邀请关系处理的超时保护,避免长时间等待 - 优化 API调用流程,增加错误处理机制 - 改进页面加载逻辑,确保主要内容优先显示 - 新增失败重试计数,防止无限重试 - 清理邀请参数缓存,避免重复处理
This commit is contained in:
202
测试首页分享链接问题.md
Normal file
202
测试首页分享链接问题.md
Normal file
@@ -0,0 +1,202 @@
|
||||
# 首页分享链接白屏问题测试指南
|
||||
|
||||
## 问题描述
|
||||
用户从分享的首页链接点击进入时,页面显示"加载中..."后出现白屏,但商品详情页分享链接正常。
|
||||
|
||||
## 问题根因分析
|
||||
1. **邀请参数处理阻塞**:首页加载时会检查邀请关系,如果API调用失败或超时,可能导致页面卡住
|
||||
2. **缺少超时保护**:邀请关系处理没有合适的超时机制
|
||||
3. **错误处理不完善**:网络错误时没有降级处理
|
||||
|
||||
## 修复内容
|
||||
已对以下文件进行修复:
|
||||
|
||||
### 1. `src/pages/index/index.tsx`
|
||||
- 添加邀请关系处理的超时保护(8秒)
|
||||
- 邀请处理失败不阻塞页面正常显示
|
||||
- 改进错误日志记录
|
||||
|
||||
### 2. `src/utils/invite.ts`
|
||||
- `handleInviteRelation`: 添加API调用超时(5秒)
|
||||
- `checkAndHandleInviteRelation`: 添加整体超时保护(6秒)
|
||||
- 添加失败重试计数,避免无限重试
|
||||
- 区分网络错误和业务错误的处理策略
|
||||
|
||||
## 测试步骤
|
||||
|
||||
### 准备工作
|
||||
```bash
|
||||
# 重新编译项目
|
||||
npm run build:weapp
|
||||
|
||||
# 或启动开发模式
|
||||
npm run dev:weapp
|
||||
```
|
||||
|
||||
### 测试用例1:正常首页分享链接
|
||||
1. **操作步骤**:
|
||||
- 在小程序首页点击分享
|
||||
- 分享给微信好友或群聊
|
||||
- 从分享链接点击进入
|
||||
|
||||
2. **预期结果**:
|
||||
- 页面应该正常加载,不出现长时间白屏
|
||||
- 如果有邀请参数,应该在后台处理,不影响页面显示
|
||||
- 控制台应该有相关日志输出
|
||||
|
||||
### 测试用例2:网络异常情况
|
||||
1. **操作步骤**:
|
||||
- 在微信开发者工具中设置网络为"离线"或"慢速"
|
||||
- 从首页分享链接进入
|
||||
|
||||
2. **预期结果**:
|
||||
- 页面应该能正常显示基本内容
|
||||
- 邀请关系处理超时后不影响页面
|
||||
- 控制台显示超时错误日志
|
||||
|
||||
### 测试用例3:带邀请参数的分享链接
|
||||
1. **操作步骤**:
|
||||
- 使用带邀请参数的链接(如从经销商分享的链接)
|
||||
- 点击进入首页
|
||||
|
||||
2. **预期结果**:
|
||||
- 页面正常加载
|
||||
- 邀请关系在后台处理
|
||||
- 处理成功或失败都不影响页面显示
|
||||
|
||||
## 调试方法
|
||||
|
||||
### 1. 查看控制台日志
|
||||
在微信开发者工具的控制台中查看以下日志:
|
||||
|
||||
```javascript
|
||||
// 正常情况下应该看到:
|
||||
"检测到待处理的邀请关系"
|
||||
"使用用户ID处理邀请关系: [用户ID]"
|
||||
"首页邀请关系处理成功" 或 "首页邀请关系处理失败"
|
||||
|
||||
// 超时情况下应该看到:
|
||||
"邀请关系处理超时,清除邀请参数"
|
||||
"邀请关系处理整体超时"
|
||||
```
|
||||
|
||||
### 2. 手动测试邀请参数
|
||||
在控制台中执行:
|
||||
|
||||
```javascript
|
||||
// 查看当前邀请参数
|
||||
console.log('邀请参数:', Taro.getStorageSync('invite_params'))
|
||||
|
||||
// 查看用户信息
|
||||
console.log('用户ID:', Taro.getStorageSync('UserId'))
|
||||
|
||||
// 手动触发邀请关系处理
|
||||
import { checkAndHandleInviteRelation } from '@/utils/invite'
|
||||
checkAndHandleInviteRelation().then(result => {
|
||||
console.log('手动处理结果:', result)
|
||||
})
|
||||
```
|
||||
|
||||
### 3. 清除测试数据
|
||||
如果需要重置测试环境:
|
||||
|
||||
```javascript
|
||||
// 清除邀请相关数据
|
||||
Taro.removeStorageSync('invite_params')
|
||||
Taro.removeStorageSync('invite_handle_fail_count')
|
||||
|
||||
// 清除邀请关系记录
|
||||
const keys = Taro.getStorageInfoSync().keys
|
||||
keys.forEach(key => {
|
||||
if (key.startsWith('invite_relation_')) {
|
||||
Taro.removeStorageSync(key)
|
||||
}
|
||||
})
|
||||
```
|
||||
|
||||
## 性能验证
|
||||
|
||||
### 页面加载时间测试
|
||||
```javascript
|
||||
// 在首页组件中添加性能监控
|
||||
const startTime = Date.now()
|
||||
|
||||
useEffect(() => {
|
||||
// 页面加载完成后
|
||||
const endTime = Date.now()
|
||||
console.log('首页加载耗时:', endTime - startTime, 'ms')
|
||||
}, [])
|
||||
```
|
||||
|
||||
### 预期性能指标
|
||||
- **正常情况**:首页应在2秒内完成基本加载
|
||||
- **网络异常**:即使邀请处理失败,页面也应在10秒内显示
|
||||
- **超时保护**:邀请处理最多8秒后自动放弃
|
||||
|
||||
## 验证清单
|
||||
|
||||
- [ ] **基础功能**
|
||||
- [ ] 首页分享链接可以正常打开
|
||||
- [ ] 页面内容正常显示
|
||||
- [ ] 不出现长时间白屏
|
||||
|
||||
- [ ] **邀请功能**
|
||||
- [ ] 带邀请参数的链接正常处理
|
||||
- [ ] 邀请处理失败不影响页面显示
|
||||
- [ ] 超时保护机制正常工作
|
||||
|
||||
- [ ] **错误处理**
|
||||
- [ ] 网络异常时页面仍可访问
|
||||
- [ ] 错误日志正常记录
|
||||
- [ ] 失败重试机制正常
|
||||
|
||||
- [ ] **性能表现**
|
||||
- [ ] 页面加载时间在可接受范围
|
||||
- [ ] 邀请处理不阻塞主要功能
|
||||
- [ ] 内存和存储使用合理
|
||||
|
||||
## 常见问题排查
|
||||
|
||||
### 问题1:仍然出现白屏
|
||||
**可能原因**:
|
||||
- 代码未正确编译
|
||||
- 缓存未清理
|
||||
- 其他组件加载问题
|
||||
|
||||
**解决方法**:
|
||||
```bash
|
||||
# 清理缓存并重新编译
|
||||
rm -rf dist/
|
||||
npm run build:weapp
|
||||
```
|
||||
|
||||
### 问题2:邀请关系处理失败
|
||||
**可能原因**:
|
||||
- API接口问题
|
||||
- 用户信息获取失败
|
||||
- 网络连接问题
|
||||
|
||||
**解决方法**:
|
||||
- 检查API接口状态
|
||||
- 确认用户登录状态
|
||||
- 查看网络请求日志
|
||||
|
||||
### 问题3:页面加载缓慢
|
||||
**可能原因**:
|
||||
- 邀请处理超时时间过长
|
||||
- 其他API调用阻塞
|
||||
|
||||
**解决方法**:
|
||||
- 调整超时时间设置
|
||||
- 优化API调用顺序
|
||||
|
||||
## 成功标准
|
||||
|
||||
✅ **修复成功的标志**:
|
||||
1. 从首页分享链接进入不再出现长时间白屏
|
||||
2. 邀请参数处理在后台进行,不阻塞页面显示
|
||||
3. 网络异常时页面仍能正常访问
|
||||
4. 控制台日志显示正常的处理流程
|
||||
5. 页面加载时间在合理范围内
|
||||
|
||||
如果以上标准都满足,说明首页分享链接白屏问题已经解决。
|
||||
Reference in New Issue
Block a user