52 lines
2.6 KiB
Markdown
52 lines
2.6 KiB
Markdown
---
|
||
name: session-20260716-1
|
||
description: 2026-07-16 第1次会话 — IconPicker 增加直接上传图片功能
|
||
metadata:
|
||
type: session
|
||
date: 2026-07-16
|
||
sessionNumber: 1
|
||
startTime: 2026-07-16T00:00:00+08:00
|
||
---
|
||
|
||
# 2026-07-16 第1次会话
|
||
|
||
## 会话摘要
|
||
|
||
1. IconPicker 增加上传按钮：前端图标选择器"已上传"标签页增加直接上传功能
|
||
2. 修复 /view 端点 404：后端新增文件预览代理端点，每次请求实时向文件服务器获取 Token 并代理返回图片
|
||
|
||
## 关键操作
|
||
|
||
### 一、IconPicker 增加上传按钮
|
||
|
||
- **做了什么**: 在 IconPicker.vue 的"已上传"标签页头部增加了「上传」按钮，点击后选择图片即自动上传到文件服务（fileType=icon），上传完成自动刷新列表并选中新图标
|
||
- **涉及文件**: `mokee-gateway-web/src/components/IconPicker.vue`
|
||
- **结果**: TypeScript 编译通过，IconPicker.vue 无类型错误
|
||
|
||
### 二、新增文件预览代理端点 GET /{id}/view
|
||
|
||
- **做了什么**: 用户反馈上传图标后 `<img>` 加载 `/zgapi/v1/admin/file/{id}/view` 返回 404，原因是文件迁至外部存储后该端点被移除。本次在 admin 后端重新实现该端点，每次请求自动向文件服务器获取 Token → 下载文件 → 返回给浏览器
|
||
- **涉及文件**:
|
||
1. `mokee-gateway-admin/.../config/WebMvcConfig.java` — 新增 `fileServiceRestTemplate` Bean
|
||
2. `mokee-gateway-admin/.../service/FileService.java` — 新增 `view()` 方法签名
|
||
3. `mokee-gateway-admin/.../service/impl/FileServiceImpl.java` — 实现核心逻辑：查元信息 → 获取 Token → RestTemplate 代理下载 → 写回 HttpServletResponse
|
||
4. `mokee-gateway-admin/.../controller/FileController.java` — 新增 `GET /{id}/view` 端点
|
||
- **结果**: Maven 编译通过，零错误
|
||
- **设计要点**:
|
||
- 文件服务 URL 通过 `@Value("${file.service.url:https://file.wg.zgitm.com}")` 注入，可配置
|
||
- Token 不使用缓存，每次请求实时获取（避免一次消费问题）
|
||
- 端点不受 `UserContextInterceptor` 拦截（WebMvcConfig 中已排除 `/view` 路径）
|
||
- 错误时返回纯文本状态（404/502/500），不依赖 JSON 响应结构
|
||
|
||
## 重要信息
|
||
|
||
- 文件服务 URL: `VITE_FILE_SERVICE_URL` 环境变量，默认 `https://file.wg.zgitm.com`
|
||
- 上传 API: `POST {FILE_SERVICE}/api/upload`，FormData 包含 `file` + `fileType`
|
||
- 上传 Token: `POST {FILE_SERVICE}/api/token`，body: `{ systemCode: 'gateway' }`
|
||
- 图标列表查询: `GET /zgapi/v1/admin/file/list?fileType=icon`
|
||
- 文件服务直写 `sys_file` 表，admin 后端只做元信息查询
|
||
|
||
## 待处理
|
||
|
||
- [ ] 通知用户确认前端部署后功能正常
|