最近做一些小项目遇到了一个小需求，AI 生成图片的时候需要一个占位图，失败的时候也需要一个提示图片。 其实使用纯 js 也能实现，但是搬到线上使用的时候会更方便一点。

案例 先看下效果吧 AI 图片生成 初步准备 要开始这个项目，首先需要： 注册并开通 Cloudflare 账户。 从域名 dashboard 页面获取必要的认证信息，包括 Account ID[1] , 和 用户 API 令牌

搞过博客的应该都知道，文字版本的文章都很比较容易处理，而图片存储一直是一个难于抉择的问题。 如果是使用 WordPress 还好，可以直接后台上传。但是现在很多静态博客都是 Hexo 或者 Hugo 这种方式，没有独立的后台，如何上传图片就变成了一个不得不面对的问题。 刚迁移完小站的时候新图片我是放在了当前站点的 public 目录下，使用固定 images/ 的方式访问，如下↓ https://www.ppanda.com/images/3e04366b23d0490abb5dfdd6d1e8e5ca/Untitled%204.png 这会有个问题，一旦站点无法访问或者图片流量异常，就会导致整站任何资源都无法访问，而这又变成了一个风险。要有永远不要把鸡蛋放在一个笼子里的意识。 于是我打算把图片资源单独放在一个图床上，和小站的服务器资源分开，这样不但规避了高耦合的风险，还减少了图片有大量请求会拖垮源站的情况。 市面上的图床有很多，免费又好用的的却很少。我目前主要在用的是阿里云的 OSS 用来做静态资源存储，价格中庸品质还行，但是我现在还没有能备案的域名，阿里云 OSS 自动生成的域名看起来不太美观，所以阿里云暂时只能算是备选方案。 刚好最近在搞 Cloudflare，那么又到了薅 Cloudflare 羊毛的时候了。 Cloudflare R2 完全可以满足我的需求。要使用 R2，需要先绑定一种支付方式，因为我没有信用卡，所以付款方式我选择了 PayPal，在 paypal 里维护下借记卡就可以通过认证了。认证完毕之后需要配置下 bucket，起个好听的名字，让自己不会忘记。 先看下改革成果，本篇文章的图片都会来自 R2。 https://img.ppanda.com/y5.gif

十一回来同事反馈搭建的 ChatGPT 服务无法访问了，我自己试了一下我这边确实是好的，但是我电脑的网络环境比较复杂，不具备太多的参考性，于是就用手机扫码访问了下，好家伙，联通号直接给我干到了反诈中心 又换了移动的流量卡访问了下，直接显示无法访问，那么服务大概率是被 wall 了。 没有办法，修吧。 好在十一前就搞了 Cloudflare，这网修起来就稍微简单了些