peixue-dev/Archive/[一次性]教师筛选401错误修复说明-2026-02-01.md

159 lines
3.9 KiB
Markdown
Raw Permalink Normal View History

2026-02-28 17:26:03 +08:00
# 教师筛选401错误修复说明
## 问题描述
游客访问教师列表页面时,控制台显示错误:
```
加载筛选选项失败: {code: 401, message: "未登录", data: {…}, silent: true}
```
错误发生在 `pages/teacher/list.vue:214`,调用 `api.teacherApi.getFilterOptions()` 时返回401。
## 根本原因
`/api/teacher/filter-options` 接口没有添加到游客白名单导致游客访问时返回401错误。
虽然前端已经配置了静默失败(`silent: true`),但页面会使用默认的筛选选项,这不是最佳体验。
## 修复方案
### 1. 前端修复request.js
`GUEST_ALLOWED_URLS` 中添加 `/api/teacher/filter-options`
```javascript
const GUEST_ALLOWED_URLS = [
'/api/notification/unread-count',
'/api/timecard/list',
'/api/home/courses',
'/api/banner/list',
'/api/service/list',
'/api/service/search',
'/api/category/all',
'/api/special-course/list',
'/api/special-course/detail',
'/api/teacher/list',
'/api/teacher/filter-options', // ✅ 新增
'/api/course/list',
'/api/course/detail',
'/api/order/list',
'/api/order/list-full'
]
```
### 2. 后端修复WebMvcConfig.java
在 JWT 拦截器的排除路径中添加 `/api/teacher/filter-options`
```java
registry.addInterceptor(jwtInterceptor)
.addPathPatterns("/api/**")
.excludePathPatterns(
"/api/auth/**",
"/api/teacher/list",
"/api/teacher/detail/**",
"/api/teacher/filter-options", // ✅ 新增
"/api/service/**",
// ... 其他路径
);
```
## 执行步骤
### 方式1使用脚本推荐
运行 `[一次性]清除缓存重新编译-教师筛选修复-2026-02-01.bat`
### 方式2手动执行
1. **清除小程序缓存**
```bash
cd peidu/uniapp
rmdir /s /q unpackage\dist
rmdir /s /q node_modules\.cache
```
2. **重新编译小程序**
```bash
npm run build:mp-weixin
```
3. **停止后端服务**
4. **重新编译后端**
```bash
cd peidu/backend
mvn clean package -DskipTests
```
5. **启动后端服务**
6. **清除微信开发者工具缓存**
- 工具 → 清除缓存 → 全部清除
7. **重新编译小程序**
## 验证步骤
1. 以游客身份访问教师列表页面
2. 点击"科目"、"区域"、"年级"筛选按钮
3. 检查控制台是否还有401错误
4. 确认筛选选项是否正常显示(不是默认选项)
## 预期结果
- ✅ 控制台不再显示 `/api/teacher/filter-options` 的401错误
- ✅ 筛选选项正常加载(从后端获取真实数据)
- ✅ 游客可以正常使用筛选功能
- ✅ 不影响已登录用户的使用
## 技术细节
### 接口说明
- **接口路径**: `/api/teacher/filter-options`
- **请求方法**: GET
- **是否需要登录**: 否(游客可访问)
- **返回数据**:
```json
{
"subjects": ["语文", "数学", "英语", ...],
"areas": ["朝阳区", "海淀区", ...],
"grades": ["1-3年级", "4-6年级", ...]
}
```
### 页面逻辑
1. 页面加载时调用 `loadFilterOptions()` 获取筛选选项
2. 如果接口失败401使用 `setDefaultFilterOptions()` 设置默认选项
3. 用户点击筛选按钮时显示筛选弹窗
4. 选择筛选条件后重新加载教师列表
### 错误处理
```javascript
try {
const res = await api.teacherApi.getFilterOptions()
// 处理数据...
} catch (error) {
console.error('加载筛选选项失败:', error)
// 使用默认选项
this.setDefaultFilterOptions()
}
```
## 相关文件
- `peidu/uniapp/src/utils/request.js` - 前端请求配置
- `peidu/backend/src/main/java/com/peidu/config/WebMvcConfig.java` - 后端拦截器配置
- `peidu/uniapp/src/pages/teacher/list.vue` - 教师列表页面
- `peidu/uniapp/src/api/index.js` - API定义
## 注意事项
1. 修改后必须重新编译前端和后端
2. 必须清除微信开发者工具缓存
3. 确保后端服务已重启
4. 这个修复不影响已登录用户的功能