CattoPic 纯serverless的图床和API综合方案

CattoPic 是什么

CattoPic 是一个自托管的图片托管服务，提供图片上传、管理和对外服务的完整功能。它的特点在于完全依托 Cloudflare 的Worker服务构建后端，前端则可部署在 Vercel。本项目后端需要使用worker的计费计划Queues模块，请提前了解相关计费规则。

项目的地址：https://github.com/Yuri-NagaSaki/CattoPic
之前写过一个Go的版本：https://github.com/Yuri-NagaSaki/ImageFlow
博客地址：https://catcat.blog/2025/12/cattopic-self-hosted-image-hosting

大家反馈自己处理小鸡扛不住，但是实际上图片处理就是非常消耗cpu资源，尤其是对于avif图片的处理。

核心功能包括：

• 多格式图片上传，支持 JPEG、PNG、GIF、WebP、AVIF
• 上传后自动转换为 WebP 和 AVIF 格式，节省存储和带宽
• 标签系统，便于图片分类管理
• 图片过期时间设置，支持临时图片
• 公开的随机图片 API，可用于博客背景或其他场景
• 横竖屏自动识别，API 可按方向筛选

技术架构

CattoPic 的技术选型颇为现代：

前端

• Next.js 16 配合 React 19
• Tailwind CSS 处理样式

后端

• Cloudflare Workers 作为计算层，使用 Hono 框架构建 API
• Cloudflare D1 作为数据库，存储图片元数据和配置
• Cloudflare R2 作为对象存储，存放图片文件
• Cloudflare KV 用于缓存
• Cloudflare Queues 处理异步任务（需付费才能使用）
• Cron Triggers 定时清理过期图片

整套后端服务运行在 Cloudflare 的边缘网络上，响应速度和稳定性都有保障。

部署指南

部署 CattoPic 需要两个步骤：配置 Cloudflare 后端服务，以及部署前端应用。

前置准备

• 一个 Cloudflare 账号
• 一个 Vercel 账号（用于前端部署）
• 本地安装 Node.js 和 pnpm
• 安装 Wrangler CLI：pnpm add -g wrangler

部署

部署的文档见项目readme。

项目预览

R2 公开访问配置

R2 存储桶需要配置公开访问才能让图片被外部访问。在 Cloudflare 控制台进入 R2 设置，绑定自定义域名或启用公开访问，记录得到的公开 URL。

主要优势

成本优势

Cloudflare 的免费额度相当慷慨：

• Workers：每天 10 万次请求
• D1：5GB 存储，500 万行读取
• R2：10GB 存储，100 万次 A 类操作，1000 万次 B 类操作
• KV：每天 10 万次读取

对于个人博客或中小站点，这些额度足够日常使用。

性能优势

借助 Cloudflare 的全球边缘网络，图片访问延迟低。自动格式转换功能会生成 WebP 和 AVIF 版本，现代浏览器可获得更小的文件体积和更快的加载速度。

数据自主

图片存储在你自己的 R2 存储桶中，数据完全由你掌控。不必担心第三方服务商的内容审查或服务终止。

功能完备

管理后台支持拖拽上传、粘贴上传、批量操作。标签系统和过期时间功能让图片管理更加灵活。随机图片 API 是一个实用的附加功能。

当前限制

CattoPic 目前存在一些使用限制，在部署前需要了解：

文件大小限制

前端上传组件限制单个文件不超过 20MB。我在后端写死了这一数值，因为cloudflare无法处理10mb以上的图片转换，同时过大的图片也会导致超时。后续可能考虑看看有没有其他方案改进。我也会时刻关注worker的更新进度。

GIF 处理

GIF 文件会保留原格式存储，不会转换为 WebP 或 AVIF。这是考虑到动态图片转换的复杂性做出的选择。

总结

CattoPic 提供了一个基于 Cloudflare 生态的图床方案。它利用 Cloudflare 的免费服务层构建了一套功能完整的图片托管系统，适合对数据主权有要求、希望控制成本的用户。部署过程需要一定的技术基础。20MB 的上传限制对于网页图片来说通常够用，如有需要也可以通过修改代码调整。

如果你正在寻找一个可控、低成本、性能不错的图床方案，CattoPic 值得考虑。