几个 HTML 页面加一个 CSS 文件,根本不需要服务器。静态托管的好处很直接:没有后端可以挂,没有数据库可以被打,没有进程需要重启,访问量再大也只是 CDN 多回几次源。

Cloudflare Pages 是目前性价比最合适的选择——免费的静态请求不限量、不限带宽,SSL 自动签发,自定义域名不额外收钱。

三条部署路径

按上手难度排序,选一条就行,后期可以随时换。

方式操作适合
拖拽上传控制台 → Workers & Pages → Create → Pages → Upload assets,把整个文件夹拖进去页面少、不想碰命令行
GitHub 自动部署仓库授权给 Cloudflare,之后每次 git push 自动发布想留版本记录
Wrangler CLI命令行一条命令推送固定工作流,最省事

第一次先用命令行或拖拽都行,几十秒后就能拿到一个 <项目名>.pages.dev 的地址,先在手机上看看排版,再谈域名。

用命令行部署

npx wrangler pages deploy public --project-name=my-blog
# 首次执行会打开浏览器要求登录授权 Cloudflare 账号

绑定自己的域名

在 Pages 项目里进入 Custom domains → Set up a custom domain,填 blog.yourdomain.com 或裸域 yourdomain.com。接下来分两种情况。

域名已经托管在 Cloudflare

最省事。Cloudflare 会自动建好 CNAME 记录,证书几分钟内签发,不需要你碰 DNS 面板。等状态变成 Active 再访问。

DNS 还在别家

在 Pages 里添加域名后,它会提示你去当前 DNS 服务商加一条记录:

类型:CNAME
主机记录:blog
记录值:my-blog.pages.dev

裸域(@)按 DNS 规范不能直接设 CNAME。如果你的 DNS 商支持 CNAME 拉平 / ALIAS / ANAME,可以用裸域;不支持就用 www 或 blog 子域。

如果嫌麻烦,把域名的 NS 整体迁到 Cloudflare 是最彻底的做法:解析和 CDN 一步到位,也不用再管两套面板。

免费额度与限制

  • 静态请求、带宽:不限量,这是它最适合博客的地方
  • 构建次数:免费版每月 500 次,拖拽上传也算一次
  • 单次部署:最多 20,000 个文件,单个文件不超过 25 MiB
  • 自定义域名:免费,自动签发并续期 SSL
  • 版本回滚:每次部署都会留档,出问题在 Deployments 里一键回退

对个人博客来说,唯一会被卡住的是「纯静态」这件事本身——没有服务端,就没有评论、搜索、表单提交。这些都能用第三方补上,成本比自建后端低得多。

几个一定会踩的坑

1. 中国大陆访问不稳定

Cloudflare 的免费节点在国内的连通性时好时坏,*.pages.dev 尤其明显。换成自己的域名走 Cloudflare 网络通常会稳一些,但依然不保证。如果读者主要在国内,认真的方案是备案后的国内对象存储加 CDN,这会推翻整个选型——先想清楚。

2. 路径大小写

线上是 Linux 环境,区分大小写。本地 Windows 上好好的 Images/Cover.jpg,部署后引用 images/cover.jpg 就是 404。文件名统一小写加中划线,最省心。

3. 缓存让你怀疑人生

改完 CSS 刷新页面没变化,八成是缓存。static/_headers 里把 CSS 缓存时间设成了 1 小时,算是个折中;真正稳定的做法是文件名带内容哈希,但那需要构建工具介入。

4. 404 页面

根目录放一个 404.html,Pages 会自动接管不存在的路径。注意它会被任意层级的 URL 使用,所以页面里的资源引用必须写成根绝对路径(/css/style.css),写相对路径在 /a/b/ 这种路径下必然丢样式。

这条是本站生成器里固定处理的,不用手动管。

小结

剩下的就是写了。工具越简单,越不容易被工具耽误。