Sign inSign up

soyorins/imageflow

By soyorins

•Updated 8 months ago

Image
0

7.4K

soyorins/imageflow repository overview

⁠ImageFlow - 现代图像服务系统

仓库地址: https://github.com/Yuri-NagaSaki/ImageFlow⁠

ImageFlow 是一个为现代网站和应用程序设计的高效图像服务系统。它能根据设备类型自动提供最合适的图像，并支持 WebP 和 AVIF 等现代图像格式，显著提升网站性能和用户体验。

⁠✨ 主要特性

  • API 密钥认证：安全的 API 密钥验证机制，保护您的图片上传功能
  • 自适应图像服务：根据设备类型（桌面端/移动端）自动提供横向或纵向图片
  • 现代格式支持：自动检测浏览器兼容性并提供 WebP 或 AVIF 格式图片
  • 简单的 API：通过简单的 API 调用获取随机图片
  • 用户友好的上传界面：支持拖拽上传，具有暗黑模式和实时预览功能
  • 图片管理功能：通过直观的管理界面查看、筛选和删除图片
  • 自动图像处理：上传后自动检测图像方向并转换为多种格式
  • 异步处理：图像转换在后台进行，不影响主服务
  • 高性能：优化的网络性能以减少加载时间
  • 易于部署：简单的配置和部署流程
  • 多存储支持：支持本地存储和 S3 兼容存储（如 R2）

⁠🚀 技术优势

  1. 安全性：API 密钥验证机制确保图片上传和管理功能的安全访问
  2. 格式转换：自动将上传的图片转换为 WebP 和 AVIF 格式，减少 30-50% 的文件大小
  3. 设备适配：为不同设备提供最合适的图片方向
  4. 热重载：上传的图片无需重启服务即可立即可用
  5. 并发处理：使用 Go 的并发特性高效处理图像转换
  6. 一致性管理：删除图片时，所有相关格式（原始、WebP、AVIF）会同时被移除
  7. 可扩展性：模块化设计便于扩展和定制
  8. 响应式设计：完美适配桌面端和移动端设备
  9. 暗黑模式支持：自动适应系统主题，支持手动切换
  10. 灵活存储：支持本地和 S3 兼容存储，通过 .env 文件轻松配置

⁠📸 界面预览

ImageFlow ImageFlow ImageFlow ImageFlow ImageFlow

⁠🔧 快速开始

⁠前置条件
  • Go 1.16 或更高版本
  • WebP 工具（cwebp）
  • AVIF 工具（avifenc）
  • Docker 和 Docker Compose（可选，用于容器化部署）
⁠安装
⁠方法一：直接安装
  1. 克隆仓库
git clone https://github.com/Yuri-NagaSaki/ImageFlow.git
cd ImageFlow
  1. 初始化 Go 模块
go mod init github.com/Yuri-NagaSaki/ImageFlow
go mod tidy
  1. 构建项目
go build -o imageflow
  1. 设置系统服务（以 systemd 为例）
[Unit]
Description=ImageFlow Service
After=network.target

[Service]
ExecStart=/path/to/imageflow
WorkingDirectory=/path/to/imageflow/directory
Restart=always
User=youruser

[Install]
WantedBy=multi-user.target
  1. 启用服务
sudo systemctl enable imageflow
sudo systemctl start imageflow
⁠方法二：Docker 部署
  1. 克隆仓库并进入目录
git clone https://github.com/Yuri-NagaSaki/ImageFlow.git
cd ImageFlow
  1. 配置 .env 文件
cp .env.example .env
# 编辑 .env 文件进行配置
  1. 使用 Docker Compose 启动服务
docker compose up -d

服务将在 http://localhost:8686 启动。

⁠配置

通过创建和编辑 .env 文件配置系统：

# API 密钥
API_KEY=your_api_key_here

# 存储配置
STORAGE_TYPE=local  # 选项：local, s3
LOCAL_STORAGE_PATH=static/images

# S3 配置（当 STORAGE_TYPE=s3 时需要）
S3_ENDPOINT=
S3_REGION=
S3_ACCESS_KEY=
S3_SECRET_KEY=
S3_BUCKET=

# 自定义域名（可选）
CUSTOM_DOMAIN=
⁠部署说明
  • 服务默认运行在 8686 端口
  • 图片文件通过卷持久化
  • .env 文件通过卷挂载用于系统配置
  • 自动包含 WebP 和 AVIF 转换工具
  • 支持健康检查
  • 存储类型（本地或 s3）通过 .env 文件中的 STORAGE_TYPE 配置

⁠📝 使用方法

⁠API 密钥认证

图片上传功能需要 API 密钥认证。您可以：

  1. 在 .env 文件中设置 API 密钥
  2. 通过网页界面输入 API 密钥
  3. API 密钥在验证成功后将被保存
⁠上传图片

访问 http://localhost:8686/ 的上传界面。您可以：

  1. 将图片拖拽到上传区域
  2. 点击选择要上传的图片
  3. 实时预览选中的图片
  4. 系统自动检测图片是横向还是纵向
  5. 上传后，图片会自动转换为 WebP 和 AVIF 格式
⁠管理图片

访问 http://localhost:8686/manage.html 的管理界面。您可以：

  1. 查看所有已上传的图片，并可按格式和方向进行筛选
  2. 点击任意图片查看详细信息
  3. 复制图片的直接URL以方便分享
  4. 删除不再需要的图片（需要API密钥认证）
  5. 当删除图片时，所有相关格式（原始、WebP、AVIF）将同时被移除
⁠获取随机图片

通过 API 获取随机图片（无需 API 密钥）：

GET http://localhost:8686/api/random

系统会根据请求头中的设备类型和浏览器支持返回最合适的图片。

⁠API 参考
接口方法描述参数认证
/api/randomGET获取随机图片orientation：可选，指定 "landscape" 或 "portrait"不需要
/uploadPOST上传新图片Form 数据，字段名 "images[]"需要 API 密钥
/api/delete-imagePOST删除图片及其所有格式JSON 数据，包含 id 和 storageType需要 API 密钥
/validate-api-keyPOST验证 API 密钥请求头中的 API 密钥不需要

⁠📁 项目结构

ImageFlow/
├── config/         # 配置相关代码
├── handlers/       # HTTP 处理器
│   ├── delete.go    # 图片删除处理器
├── scripts/        # 实用脚本
├── static/         # 静态文件和图片存储
│   ├── favicon.ico # 网站图标
│   ├── favicon.svg # SVG 网站图标
│   ├── favicon-16.png # 16px 网站图标
│   ├── favicon-32.png # 32px 网站图标
│   ├── favicon-48.png # 48px 网站图标
│   ├── imageflow1.png # 预览图片 1
│   ├── imageflow2.png # 预览图片 2
│   ├── images/    # 图片存储目录
│   │   ├── landscape/ # 横向图片
│   │   │   ├── avif/  # AVIF 格式
│   │   │   └── webp/  # WebP 格式
│   │   ├── portrait/  # 纵向图片
│   │   │   ├── avif/  # AVIF 格式
│   │   │   └── webp/  # WebP 格式
│   │   └── original/  # 原始上传图片
│   ├── index.html # 主页
│   ├── styles.css # 样式表
│   ├── manage.html # 图片管理界面
│   ├── manage.js   # 图片管理功能脚本
│   └── upload.js  # 上传功能脚本
├── utils/         # 实用函数
├── main.go        # 程序入口
├── Dockerfile     # Docker 构建文件
├── docker-compose.yml # Docker Compose 配置
├── .env           # 环境变量
└── README.md      # 项目文档

⁠🤝 贡献

欢迎贡献！随时提交代码、报告问题或提出改进建议！

⁠📄 许可证

本项目基于 MIT 许可证 - 详见 LICENSE⁠ 文件。

⁠📞 联系方式

Blog - 猫猫博客⁠

项目链接：https://github.com/Yuri-NagaSaki/ImageFlow⁠

⭐ 如果您喜欢这个项目，请给它一个星标！⭐

由 Yuri NagaSaki 用 ❤️ 制作

Tag summary

Content type

Image

Digest

sha256:36c322bcd…

Size

40.2 MB

Last updated

8 months ago

Run in Docker Desktop

Requires Docker Desktop 4.37.1 or later.