新图床折腾记
最近这几天真的很烦！为了让图床支持 WebP 格式，我做了很多尝试，折腾了各种方案，效果却总是不尽人意。写下这篇博客，也算是记录下自己的探索过程，希望对后来者有所帮助。
初始尝试：Cloudflare R2
一开始，我尝试使用 Cloudflare R2 作为图床的存储后端。R2 本身是一个不错的对象存储服务，价格低廉且性能优越，我也一直在用它做其他项目的文件存储。然而，在把 R2 嵌入我的代码时，问题接踵而至：
- 集成复杂：R2 的 API 和我的现有框架不太兼容，需要额外的开发工作。
- 缺乏现成方案：针对 R2 的开源图床项目非常少，自己从零开发显然超出了时间成本预算。
尝试了几天后，我不得不暂时放弃 R2 的方案。
转机：发现 Cloudflare-ImgBed 项目
在我几乎决定放弃时，偶然间发现了一个让我眼前一亮的开源项目：MarSeventh/CloudFlare-ImgBed。
这个项目基于 Telegraph Image 进行了全面改造，正好解决了我遇到的所有痛点：
- 支持 WebP 和 SVG 格式：原生支持，上传无障碍。
- 支持 R2 存储：可以无缝集成 Cloudflare 的 R2。
- 压缩选项自由：可以选择是否压缩上传的图片质量。
- 支持 Telegram Bot：对于需要在 Telegram 群中直接分享图片的用户，非常方便。
总之，这个项目完美契合了我的需求！我立刻 Fork 了它，并开始动手部署。
部署与优化过程
项目的部署过程并不复杂，大致步骤如下：
- Fork 项目：我先在 GitHub 上 Fork 了 CloudFlare-ImgBed。
- 配置 Cloudflare Pages：将项目代码部署到 Cloudflare Pages，作为前端服务。
- 新建 KV（键值存储）：由于原项目的 KV 配置和我之前的环境不兼容，我重新创建了一个 KV 存储空间，用于记录图片的元信息。
- 绑定 R2 存储桶：按照文档配置，将图片文件实际存储在 Cloudflare R2 中。
在一切配置完成后，我尝试上传了一张 WebP 格式的图片，发现一切运行正常。尤其是拖动图片上传成功的一瞬间，之前的折腾和烦躁感都一扫而空。
为了让项目更加符合我的需求，我还做了以下调整：
- 关闭图片压缩：在 API 设置中禁用了图片压缩功能，避免 PNG 图片的透明底被压缩成白底。
- 增强在线浏览功能：Telegraph Image 原项目不支持在线浏览，我通过 Cloudflare Worker 补充了缺失的请求头，实现了在线访问图片的能力。
Telegraph Image 的缺点与新项目的解决方案
回顾整个过程，这个新项目完美地解决了 Telegraph Image 原项目的一些痛点：
不能在线浏览
- 原项目：无法直接访问图片 URL 查看内容。
- 我的优化：使用 Cloudflare Worker 补充请求头，支持在线预览。
不能取消压缩画质，PNG 透明底会消失
- 原项目：所有图片默认压缩，PNG 图片的透明背景会被替换成白色。
- 我的优化：将上传模式改为文件上传，禁用压缩选项。
不支持 WebP 和 SVG 格式
- 原项目：上传这些格式会报错。
- 新项目：新增了对 WebP 和 SVG 格式的支持，无需额外配置。
不支持 R2 存储
- 原项目：完全依赖 Telegraph 官方的存储，不够灵活。
- 新项目：可以将图片存储在 Cloudflare R2，更适合有长期存储需求的用户。
使用体验与总结
部署完成后，我将之前的 PicGo 图床替换成了这个新项目。为了保证图片质量，我还调整了 PicGo 的配置，直接调用新图床的 API 上传图片。整个体验非常顺畅，完全符合我的预期。
通过这次折腾，我不仅解决了 WebP 图片支持的问题，还得到了一个更强大的图床工具。如果你也在为图片存储方案发愁，强烈推荐试试这个项目：CloudFlare-ImgBed。
ps.打字烦了所以我让gpt帮我润色文章的嘿嘿。你会原谅老龙我的吧呜呜~
