# 甲辰藏品管理系统 v1.0.1 发布说明 **发布日期**: 2026-03-16 **版本**: v1.0.1 **前置版本**: v1.0.0 **分支**: `main` --- ## 🎯 版本亮点 ### 1. Logo 显示问题修复 🐉 **问题描述**: - 藏品详情页面图片加载失败时显示 Logo,导致所有无图片的藏品都显示 Logo - 用户体验混淆,无法区分"无图片"和"图片加载失败" **解决方案**: - 修改 `frontend/src/pages/Detail.jsx` 的 `onError` 处理逻辑 - 图片加载失败时显示"无图片"占位符,不再显示 Logo - Logo 仅在登录页、首页等指定位置显示 **代码变更**: ```jsx // 修复前 onError={(e) => { e.target.src = '/static/images/jiachenlong-logo.png'; }} // 修复后 onError={(e) => { e.target.style.display = 'none'; e.target.parentElement.innerHTML = '
无图片
'; }} ``` **影响范围**: - ✅ 藏品详情页图片显示 - ✅ 藏品列表页图片显示 - ✅ Logo 使用规范化 --- ### 2. 图片代理问题修复 🔧 **问题描述**: - 前端服务器 Nginx 配置中,图片扩展名 location 优先级高于 `/uploads` - 导致 `.jpg/.jpeg` 文件在本地 `/var/www/html/` 查找,而不是代理到后端 - 所有藏品图片返回 404 错误 **根本原因**: ```nginx # ❌ 错误配置(图片扩展名 location 优先级过高) location /uploads { proxy_pass http://backend:3000/uploads; } location ~* \.(jpg|jpeg|png)$ { # 这个优先级更高! expires 1y; } ``` **解决方案**: - 调整 Nginx location 优先级,`/uploads` 移到图片扩展名 location 之前 - 图片扩展名 location 只处理字体文件(woff、ttf 等) - 前端静态图片使用 `/static/` 路径单独处理 **代码变更**: ```nginx # ✅ 正确配置 # 1. 字体文件缓存(不影响图片) location ~* \.(js|css|woff|woff2|ttf|eot)$ { expires 1y; } # 2. 图片上传文件代理(优先级最高) location /uploads { proxy_pass http://47.110.37.129:3000/uploads; client_max_body_size 20M; } # 3. 前端静态图片(/static/ 目录) location ~* ^/static/.*\.(png|jpg|jpeg|gif|ico|svg)$ { expires 1y; } ``` **影响范围**: - ✅ 藏品详情图片显示 - ✅ 图片预览弹窗 - ✅ 图片切换功能 --- ### 3. 后端图片数据加载修复 📊 **问题描述**: - `get_collections()` API 函数中 `'images': []` 是硬编码的空数组 - 藏品列表 API 不返回图片数据,导致前端无法显示缩略图 **解决方案**: - 在 `get_collections()` 函数中添加图片数据加载逻辑 - 查询 `collection_images` 表并返回图片信息 **代码变更**: ```python # backend/app/routers/collections.py # 修复前 'images': [] data_list.append(to_camel_case(item_dict)) # 修复后 'images': [] # 加载图片数据 from app.models.models import CollectionImage images = db.query(CollectionImage).filter( CollectionImage.collection_id == item.f99_90_id ).all() for img in images: item_dict['images'].append({ 'id': img.id, 'filename': img.filename, 'original_name': img.original_name, 'path': img.path, 'created_at': img.created_at.isoformat() if img.created_at else None }) data_list.append(to_camel_case(item_dict)) ``` **影响范围**: - ✅ 藏品列表 API - ✅ 前端缩略图显示 - ✅ 所有依赖图片数据的页面 --- ### 4. 前端图片路径修复 🔗 **问题描述**: - 数据库中的 `path` 字段已包含 `uploads/` 前缀 - 前端代码又添加了 `/uploads/` 前缀,导致路径重复 - 最终 URL:`/uploads/uploads/collections/xxx.jpg` (404 错误) **解决方案**: - 前端代码直接使用 `path` 字段,不添加额外前缀 **代码变更**: ```jsx // frontend/src/pages/Detail.jsx // 修复前 src={`/uploads/${img.path}`} // 修复后 src={`/${img.path}`} ``` **影响范围**: - ✅ 藏品详情页图片 - ✅ 图片预览弹窗 - ✅ 所有图片显示位置 --- ### 5. 编辑页面图片预览修复 📝 **问题描述**: - 编辑页面 `Edit.jsx` 中图片预览 URL 写死了错误的服务器地址 - 导致编辑页面无法显示图片预览 **解决方案**: - 使用相对路径代替硬编码 URL **代码变更**: ```jsx // frontend/src/pages/Edit.jsx // 修复前 (2 处) preview: `http://120.26.133.10:3000/${img.path}` // 修复后 preview: `/${img.path}` ``` **影响范围**: - ✅ 编辑页面图片预览 - ✅ 图片上传后预览更新 --- ## 📊 技术细节 ### 图片访问流程 ``` 用户访问 http://8.149.137.26/uploads/collections/xxx.jpg ↓ Nginx 接收请求(匹配 /uploads location) ↓ 代理到 http://47.110.37.129:3000/uploads/collections/xxx.jpg ↓ FastAPI 返回图片文件 ↓ 用户看到图片 ✅ ``` ### 数据库存储 | 字段 | 示例值 | |------|--------| | `path` | `uploads/collections/admin-0001-J051963351.jpeg` | | `filename` | `admin-0001-J051963351.jpeg` | | `original_name` | `001.JPG` | ### 文件命名规则 **格式**: `用户名 - 藏品编号 - 冠字号。扩展名` **示例**: - `admin-0001-J051963351.jpeg` - `admin-0002-J035161361.JPG` --- ## 📝 文件变更清单 ### 前端文件 - ✅ `frontend/src/pages/Detail.jsx` - 图片路径和 onError 处理 - ✅ `frontend/src/pages/Home.jsx` - Logo 引用 - ✅ `frontend/src/pages/Login.jsx` - Logo 显示 - ✅ `frontend/package.json` - 版本号 1.0.1 ### 后端文件 - ✅ `backend/app/routers/collections.py` - 图片数据加载 ### 配置文件 - ✅ `config/VERSION` - 版本号 1.0.1 - ✅ `config/nginx.conf` - Nginx location 优先级调整 ### 文档文件 - ✅ `docs/IMAGE_PROCESSING_FLOW.md` - 图片处理流程 - ✅ `docs/CLEANUP_REPORT.md` - 服务器清理报告 - ✅ `RELEASE_v1.0.1.md` - 本发布说明 --- ## ✅ 测试验证 ### 功能测试 | 测试项 | 状态 | 说明 | |--------|------|------| | Logo 显示 | ✅ 通过 | 仅在登录页、首页显示 | | 藏品列表图片 | ✅ 通过 | 缩略图正常显示 | | 藏品详情图片 | ✅ 通过 | 大图正常显示 | | 图片预览弹窗 | ✅ 通过 | 点击可打开预览 | | 图片切换 | ✅ 通过 | 左右按钮切换正常 | | 无图片占位符 | ✅ 通过 | 显示"无图片"而非 Logo | ### API 测试 | 接口 | 状态 | 说明 | |------|------|------| | GET /api/collections | ✅ 200 | 返回图片数据 | | GET /api/collections/:id | ✅ 200 | 返回图片详情 | | POST /api/collections/upload-image | ✅ 200 | 图片上传正常 | | GET /uploads/collections/xxx.jpg | ✅ 200 | 图片代理正常 | --- ## 🎯 升级建议 ### 从 v1.0.0 升级 1. **拉取最新代码** ```bash git pull origin main ``` 2. **更新前端** ```bash cd frontend npm install npm run build ``` 3. **重启后端服务** ```bash cd backend pip install -r requirements.txt pkill -f uvicorn nohup python3 -m uvicorn app.main:app --port 3000 --host 0.0.0.0 & ``` 4. **更新 Nginx 配置** ```bash sudo cp config/nginx.conf /etc/nginx/conf.d/jiachenlong.conf sudo nginx -s reload ``` --- ## 📚 相关文档 - `docs/IMAGE_PROCESSING_FLOW.md` - 图片处理完整流程 - `static/images/LOGO_GUIDE.md` - Logo 使用规范 - `docs/CLEANUP_REPORT.md` - 服务器清理报告 --- ## 🐛 已知问题 无 --- ## 📞 技术支持 如有问题,请参考: - 部署文档:`DEPLOYMENT_v1.0.0.md` - 错误码文档:`ERROR_CODES.md` - 后端服务指南:`BACKEND_SERVICE_GUIDE.md` --- **甲辰藏品管理系统开发团队** 2026-03-16