1786 字
9 分钟
这几天学 Cloudflare 做了什么:从个人主页到工具全家桶

这几天我把 Cloudflare 的几块核心能力挨个摸了一遍,顺手做出了一个能用的小工具集合。现在它们都挂在博客的 工具页 上,博客本身也换成了自己的域名 blog.dogelover.online。

这篇是总览:按时间顺序把「学了什么、做出了什么」串起来。细节可以点进下面链接的专题文章。

1. Pages:先把网站挂上网#

起点很简单:用 Cloudflare Pages 发布静态网站。Pages 会把 HTML / CSS / 图片分发到全球机房,自动配好 HTTPS。

我先上传了一个很朴素的个人主页,后来换成 Fuwari 博客模板(基于 Astro),于是有了现在的博客。第一次发布的过程写在 《用 Cloudflare Pages 搭建个人主页》 里。

一句话:Pages 负责「把已经做好的网页放到全世界都能访问的地方」。

2. Workers:让网站能「干活」#

静态页面无法自己生成短链接、调用 AI、读写数据库。这些要靠 Workers:一段跑在 Cloudflare 边缘机房里的 JavaScript。有人访问网址时,离他最近的机房会执行这段代码并返回结果。

我做的第一个 Worker 相关项目,是短链接和 AI 小助手,详见 《用 Cloudflare Workers 做了两个小工具》。

3. KV 短链接:键值存储#

短链接需要把「短码 → 长网址」存起来,还要统计点击次数。这里用的是 Workers KV:一种简单的键值存储,读写很快,适合这种「一个 key 对应一个 value」的场景。

现在在工具页里可以生成短链、复制链接、查看点击次数。

和数据库的差别:KV 像字典;后面讲的 D1 更像表格。

4. Workers AI:边缘上的模型#

第二个小工具是 AI 小助手:中英互译 + 简单问答。模型跑在 Cloudflare 的 Workers AI 上,Worker 里绑定一个 AI,调用时指定模型名称即可。

免费计划有每日 Neurons 额度;用完当天会报错,而不是偷偷扣费。试用时记得控制一下频率。

5. CORS + 工具页:把小工具塞进博客#

博客在 blog.dogelover.online,各个 Worker 却各自有 *.workers.dev 网址。浏览器默认不允许网页随便调用其他域名的接口,这就是 跨域(CORS)。

解决办法是在 Worker 里写一份允许名单,只放行博客域名(以及本地测试地址)。别人就算抄走页面代码,也调不动这些接口。

整合之后,短链接和 AI 都出现在 工具页 里,样式跟博客统一,手机上也能用。

6. GitHub Actions:推送即发布#

一开始改博客要:本地构建 → 打 zip → 控制台上传。后来我把源码放进 GitHub 私有仓库,用 GitHub Actions 在推送到 main 时自动构建,再上传到 Pages。

密钥只给了「发布 Pages」所需的最小权限。过程写在 《告别手动上传:用 GitHub Actions 自动发布博客》 里。你现在看到的文章,也是这样发上来的。

7. 自定义域名:blog.dogelover.online#

*.pages.dev 可以一直免费用。我已经有域名 dogelover.online,就加了子域名 blog,在 Cloudflare Pages 里绑定自定义域名,再在管理该域名的账号里加一条 CNAME,指向 Pages 项目。

几分钟后 HTTPS 证书签好,blog.dogelover.online 就能打开。原来的 dreamer-home.pages.dev 也还在。站点配置和 RSS 订阅地址也改成了新域名。

8. D1 留言板:边缘上的 SQLite#

D1 是 Cloudflare 上的 SQLite 数据库:数据像表格一样按行存,用 SQL 查询,适合留言、计数这类「多行记录、要排序」的场景。

我做了一个简单留言板:访客写名字和内容,存在 D1 里,刷新就能看到。和 KV 不同,这里用的是 SELECT / INSERT,而不是单纯的 get / put。

留言板同样挂在 工具页 底部。

9. R2 图床:对象存储#

R2 是对象存储,适合放大文件和图片(按「一个文件一个对象」来存)。开通时需要绑定支付方式,套餐本身可以是 $0/月,免费额度对个人图床通常够用;超额才会计费。

图床 Worker 负责上传和按链接读取;桶本身不公开,必须走 Worker,这样更安全。传完会得到一个可直接引用的图片链接。入口也在工具页的「图床」区块。

后来我又加了可选的 访问码(Worker 机密 ACCESS_CODE):开启后上传必须带正确口令,工具页会把口令记在浏览器本地,减少陌生访客直接往 R2 塞文件、踩免费额度或产生超额费用的风险。

10. Turnstile:挡一下机器人#

留言板和图床谁都能用,容易被刷。我给这两项加了 Cloudflare Turnstile:一种比传统验证码更省事的人机验证,访客点一下或后台自动过关即可。

没有通过验证的请求会被接口拒绝。短链接和 AI 风险相对小,暂时没加。

11. Cron:到点自动跑#

Cron Triggers 相当于给 Worker 定闹钟。到点 Cloudflare 会自动调用一次,不用等人访问网址。

我做了一个定时任务:每天北京时间上午 9 点,自动往留言板写一条「学习日报」。状态页上还能看到上次运行时间,也可以手动再跑一次。免费账号大约能配几个定时器,对个人项目够用。

12. 异常监控:每小时巡检 + 邮件#

工具多了之后,我想早点知道「哪个挂了」,尤其是绑了卡的 R2。于是做了 dreamer-watch:用 Cron 每小时跑一轮,用 Cloudflare API 确认各 Worker 脚本还在,再用 HTTP 检查博客首页和工具页;异常时通过 Resend 发中文邮件到我的 Gmail。

状态页可以看到上次巡检结果和连续失败次数。邮件用 onboarding@resend.dev 发就够个人告警;告警本身不能替代你在 Cloudflare 账单页自己设用量提醒。

现在工具页里有什么#

打开 blog.dogelover.online/tools/ 可以看到:

工具用到的 Cloudflare 能力
短链接Workers + KV
AI 小助手Workers + Workers AI
留言板Workers + D1 + Turnstile
图床Workers + R2 + Turnstile + 访问码
(幕后)学习日报Workers + Cron + D1
(幕后)异常监控Workers + Cron + D1 + Resend

博客本身:Pages + GitHub Actions 自动发布 + 自定义域名。

这几天最大的收获#

  1. 先能跑,再学深:Pages 挂上网 → Workers 干点活 → 再学存储和防护,比一开始啃文档有效。
  2. 选对存储:键值用 KV,表格用 D1,大文件用 R2,别硬套。
  3. 跨域和权限要认真:白名单、最小权限 Token、Turnstile,都是「能用」变成「能安心用」的关键。
  4. 自动化很爽:推送到 GitHub 就能发布,改文章的心理负担小了很多。

接下来可能把 R2、Turnstile、Cron、监控拆成更细的笔记,或者给短链接、AI 也加一点限流。你要是也在学 Cloudflare,欢迎从 Pages 开始,做点小东西,比只看书记得牢。

这几天学 Cloudflare 做了什么:从个人主页到工具全家桶
https://blog.dogelover.online/posts/cloudflare-learning-summary/
作者
Dreamer
发布于
2026-10-09
许可协议
CC BY-NC-SA 4.0