5.5 KiB
5.5 KiB
游客模式三个页面修复完成
修复时间: 2026-02-01
问题: 游客模式下,兴趣培养、专项突破、测评师三个页面返回401错误
📊 问题分析
根本原因
前端游客白名单缺少这三个页面的API接口
对比分析
- ✅ 服务列表页面: 已添加白名单 + error.silent 检查 → 正常显示
- ✅ 教师列表页面: 已添加白名单 + 后端支持匿名访问 → 正常显示
- ❌ 兴趣培养页面: 缺少白名单 → 返回401错误
- ❌ 专项突破页面: 缺少白名单 → 返回401错误
- ❌ 测评师页面: 缺少白名单 → 返回401错误
🔧 修复内容
1. 前端白名单配置 (request.js)
文件: peidu/uniapp/src/utils/request.js
添加的接口:
const GUEST_ALLOWED_URLS = [
// ... 其他接口
'/api/interest-course/list', // ✅ 新增 - 兴趣培养课程列表
'/api/interest-course/detail', // ✅ 新增 - 兴趣培养课程详情
'/api/assessment/list', // ✅ 新增 - 测评服务列表
'/api/assessment/detail', // ✅ 新增 - 测评服务详情
]
2. 页面错误处理
2.1 兴趣培养页面
文件: peidu/uniapp/src/service-package/pages/interest/list.vue
catch (error) {
console.error('加载兴趣培养课程列表失败:', error)
// ✅ 游客模式:静默失败,不显示错误提示
if (error.silent) {
console.log('游客模式,静默失败,不显示提示')
// 游客模式下显示空列表,不影响页面显示
} else {
uni.showToast({
title: '加载失败',
icon: 'none'
})
}
}
2.2 专项突破页面
文件: peidu/uniapp/src/service-package/pages/special/list.vue
catch (error) {
console.error('加载课程失败:', error)
// ✅ 游客模式:静默失败,不显示错误提示
if (error.silent) {
console.log('游客模式,静默失败,不显示提示')
// 游客模式下显示空列表,不影响页面显示
} else {
uni.showToast({
title: '加载失败,请重试',
icon: 'none'
})
}
}
2.3 测评师页面
文件: peidu/uniapp/src/service-package/pages/assessment/list.vue
catch (error) {
console.error('加载测评服务列表失败:', error)
// ✅ 游客模式:静默失败,不显示错误提示
if (error.silent) {
console.log('游客模式,静默失败,不显示提示')
// 游客模式下显示空列表,不影响页面显示
} else {
uni.showToast({
title: '加载失败',
icon: 'none'
})
}
}
✅ 后端配置确认
文件: peidu/backend/src/main/java/com/peidu/config/WebMvcConfig.java
后端已经配置了这些接口的匿名访问:
.excludePathPatterns(
"/api/interest/**", // ✅ 兴趣培养
"/api/assessment/**", // ✅ 测评服务
"/api/special/**", // ✅ 专项突破
// ...
)
🎯 修复逻辑
游客模式访问流程
游客访问页面
↓
前端发起API请求(无token)
↓
后端检查JWT拦截器
↓
接口在白名单中 → 允许访问 → 返回数据 ✅
↓
前端收到数据 → 正常显示
如果后端返回401(理论上不应该发生)
后端返回401
↓
request.js 检查:isGuestAllowedUrl(url)
↓
是游客白名单接口 → reject({ silent: true })
↓
页面 catch 块检查 error.silent
↓
silent = true → 不显示错误提示,显示空列表
📝 测试步骤
1. 编译小程序
运行脚本:
Archive/[一次性]清除缓存重新编译-游客模式三个页面修复-2026-02-01.bat
2. 测试游客模式
- 打开微信开发者工具
- 退出登录(进入游客模式)
- 点击首页的"兴趣培养"按钮
- 点击首页的"专项突破"按钮
- 点击首页的"测评师"按钮
3. 预期结果
- ✅ 三个页面都能正常打开
- ✅ 不会弹出"登录已过期"提示
- ✅ 不会弹出401错误提示
- ✅ 页面显示空列表或实际数据(取决于后端是否返回数据)
- ✅ 游客可以浏览页面内容
4. 登录后测试
- 登录账号
- 再次访问三个页面
- 确认数据正常显示
🔍 对比:修复前后
修复前
游客访问 → 401错误 → 弹窗提示"登录已过期" → 跳转登录页 ❌
修复后
游客访问 → 正常显示页面 → 可以浏览内容 ✅
📋 修改文件清单
- ✅
peidu/uniapp/src/utils/request.js- 添加游客白名单 - ✅
peidu/uniapp/src/service-package/pages/interest/list.vue- 添加 error.silent 检查 - ✅
peidu/uniapp/src/service-package/pages/special/list.vue- 添加 error.silent 检查 - ✅
peidu/uniapp/src/service-package/pages/assessment/list.vue- 添加 error.silent 检查
💡 技术要点
1. 游客白名单机制
- 前端维护一个游客可访问的接口列表
- 当游客访问这些接口返回401时,不弹窗、不跳转
- 页面可以正常显示,只是数据为空
2. error.silent 标记
- request.js 在检测到游客访问白名单接口返回401时,添加
silent: true标记 - 页面 catch 块检查这个标记,决定是否显示错误提示
3. 后端匿名访问
- 后端通过 JWT 拦截器的 excludePathPatterns 配置匿名访问
- 这些接口不需要 token 也能访问
✨ 修复完成
游客模式下,兴趣培养、专项突破、测评师三个页面现在可以正常访问了!