Ubuntu相册查看器
手机端友好的相册浏览 Web 应用。
功能特性
- 📱 手机浏览器优化，响应式布局
- 🖼️ 三列网格展示，留白均匀
- 📂 支持多级相册嵌套
- 🔄 懒加载优化，流畅浏览
- 🔍 点击查看原图
- ⚡ 缩略图加速加载
项目结构
album-viewer/
├── backend/
│ └── app.py # Flask 后端服务
├── frontend/
│ └── index.html # 前端页面
├── tools/
│ └── generate_thumbnails.py # 缩略图生成工具
└── start.sh # 启动脚本
安装依赖
# 安装 Python 依赖
pip3 install flask flask-cors
# 确保已安装 ImageMagick（用于生成缩略图）
which convert
使用方法
1. 生成缩略图（首次使用必需）
cd ~/nanocode/album-viewer
python3 tools/generate_thumbnails.py
工具特性：
- ✅ 递归处理：自动扫描所有子目录
- ✅ 重复安全：已存在的缩略图自动跳过
- ✅ 智能更新：原图修改后自动重新生成
- ✅ 自动清理：删除原图后自动清理对应缩略图
缩略图会生成在每个相册的 thumbnails/ 子目录下。
2. 启动服务
./start.sh
或手动启动：
cd backend
python3 app.py
3. 访问
- PC: http://localhost:8892
- 手机: http://<服务器IP>:8892
相册目录结构
/home/ubuntu/albums/
├── 相册1/
│ ├── image1.jpg
│ ├── image2.jpg
│ └── thumbnails/ # 自动生成的缩略图
│ ├── image1.jpg
│ └── image2.jpg
├── 相册2/
│ └── ...
└── 子相册/
└── ...
技术规格
| 项目 | 规格 |
|---|---|
| 缩略图宽度 | 320px（等比缩放） |
| 网格布局 | 3列，间距 12px |
| 缩略图比例 | 2:3（高度=宽度×1.5） |
| 图片质量 | 85% |
| 服务端口 | 8892 |
更新相册
添加新图片后，重新生成缩略图：
python3 tools/generate_thumbnails.py
工具会自动跳过已存在的缩略图。