CloudImgs：
一个简单、方便的开源图床项目，一键 NAS 部署，支持图片上传、管理、预览和分享。
功能特性：
🚀 核心功能
- • 图片上传: 支持拖拽上传，多种图片格式
- • 图片管理: 浏览、预览、下载、删除图片
- • 图片分享: 一键复制图片链接
- • 统计信息: 实时显示存储使用情况
🔐 密码保护
- • 访问控制: 可设置访问密码，保护图片安全
- • 登录界面: 美观的登录界面，支持密码验证
- • 会话管理: 登录状态自动保存，支持退出登录
- • API 保护: 所有管理接口都需要密码验证
- • 可选启用: 通过环境变量控制是否启用密码保护
📁 子目录管理
- • 智能目录选择: 可选择现有目录或输入新目录
- • 目录信息展示: 在图片管理页面显示当前目录信息
- • 目录统计: 支持按目录统计图片数量和存储大小
🔧 SVG 工具
- • SVG 转 PNG: 输入 SVG 代码，实时转换为 PNG 图片
- • 在线预览: 转换后立即预览 PNG 效果
- • 一键上传: 转换完成后直接上传到图床
- • 批量下载: 支持下载转换后的 PNG 图片
- • 示例代码: 提供常用 SVG 示例代码
- • 自定义文件名: 支持自定义上传和下载的文件名
- • 自动生成文件名: 基于时间戳自动生成文件名
🗜️ 图片压缩工具
- • Canvas 压缩: 基于 Canvas API 进行高质量图片压缩
- • 尺寸调整: 支持设置压缩后的宽度和高度
- • 宽高比锁定: 自动保持原始图片的宽高比例
- • 质量调节: 1-100% 可调节压缩质量
- • 实时预览: 压缩后立即预览效果
- • 压缩信息: 显示原始大小、压缩后大小和压缩率
- • 一键上传: 压缩完成后直接上传到图床
- • 本地下载: 支持下载压缩后的图片
- • 智能默认: 根据原始图片自动计算合适的压缩尺寸
🌓 主题切换功能
- • 多主题支持: 支持浅色主题和暗色主题
- • 自动模式: 根据系统时间自动切换主题（6:00-18:00 浅色，18:00-6:00 暗色）
- • 手动切换: 支持手动选择浅色、暗色或自动模式
- • 主题持久化: 主题设置自动保存到本地存储
- • 实时切换: 主题切换立即生效，无需刷新页面
- • 全面适配: 所有页面和组件都完美适配两种主题
- • 优雅动画: 主题切换时有平滑的过渡效果
📱 移动端适配
- • 响应式布局: 基于 Ant Design Grid 系统的完美响应式设计
- • 移动端导航: 移动端使用抽屉式菜单，提供更好的触摸体验
- • 自适应布局: 根据屏幕尺寸自动调整布局和组件大小
- • 触摸优化: 按钮和交互元素针对移动端触摸操作进行优化
- • 图片管理: 移动端图片网格自动调整为单列布局
- • API 文档: 移动端代码示例和文档自动适配小屏幕
- • 主题适配: 移动端完美支持浅色和暗色主题切换
安装
Docker Compose
services:
cloudimgs:
image: qazzxxx/cloudimgs:latest
container_name: cloudimgs
ports:
- 3001:3001
environment:
- NODE_ENV=production
- PORT=3001
- STORAGE_PATH=/app/uploads
volumes:
- ./uploads:/app/uploads
restart: unless-stopped
参数说明（更多参数建议去看文档）
:::PORT（环境变量）：设置访问端口
PASSWORD（环境变量，可选）：设置访问密码
/app/uploads（路径）：上传目录配置
:::
TIP：原模板是使用 root 用户运行的，这里我是直接给 777 权限解决权限问题的
sudo chmod -R 777 /vol1/1000/docker/cloudimgs
使用
浏览器中输入 http://NAS的IP:3001 就能看到界面
右上角，可以切换为暗色主题（为了截图效果，这里我就用深色主题了）
点击上传图片，不行的注意一下是不是权限问题
来到对应上传目录，能看到前面上传的图片
图片管理，可以图片进行浏览，下载和删除等操作
统计信息，直观显示当前图床信息状态
除了图床功能，还有 SVG 工具、图片压缩和图片裁剪等便捷功能
开放接口，有详细的说明文档，支持二次开放调用图床功能
总结
CloudImgs 这款开源图床，使用下来感觉就是：轻量，简单，便捷。不需要额外部署数据库，使用简单没有门槛，支持图片上传、管理、分享及统计功能。对于有图床需求的个人用户，可以试试这款图床。
综合推荐：⭐⭐⭐（适合有图床需要的个人用户）
使用体验：⭐⭐⭐（轻量，简单，便捷）
部署难易：⭐⭐（简单）︎
