两年前我第一次部署博客，买服务器、装 Nginx、配证书、防攻击，一套下来一个周末没了，每个月还要交服务器钱。今年帮朋友重新搭站，直接用了 Cloudflare Pages：纯静态站免费、全球 CDN 分发、推送代码自动部署、HTTPS 证书自动签发。从建仓库到站点上线，确实只要五分钟。

为什么选 Cloudflare Pages

  • 免费额度慷慨：每月 500 次构建、不限带宽的静态请求，个人博客根本用不完；
  • 全球边缘网络：静态资源直接从离用户最近的节点返回，海外访问飞快；
  • Git 自动化：绑定仓库后，git push 即部署，PR 还会生成预览地址；
  • 零运维：没有服务器就没有被入侵、被挖矿这回事。

代价也有：国内直连速度一般，且只适合纯静态或预渲染的站点。对个人博客来说，这两条都可以接受。

准备工作

你只需要三样东西：一个 GitHub 账号、一份静态站点文件（HTML/CSS/JS 即可，本站没有构建步骤）、一个域名（在哪家买的都行）。

第一步：把站点推上 GitHub

在本地站点目录执行：

git init
git add .
git commit -m "init: 博客第一版"
git branch -M main
git remote add origin https://github.com/<你的用户名>/<仓库名>.git
git push -u origin main

仓库建议设为 public——私有仓库在 Pages 的免费版里也支持，但公开仓库的构建队列优先级更高。

第二步：创建 Pages 项目

登录 Cloudflare Dashboard，进入 Workers & Pages → Create → Pages → Connect to Git，授权并选中刚才的仓库，构建配置这样填：

  • Framework preset：None
  • Build command：留空（纯静态站不需要构建）
  • Build output directory：/

点 Save and Deploy，一分钟后你会拿到一个 xxx.pages.dev 的地址，站点已经全球可访问了。此后每次推送到 main 分支都会自动重新部署。

第三步：绑定自定义域名

进入 Pages 项目 → Custom domains → Set up a custom domain，输入 rnadow.top：

  • 如果域名的 DNS 已托管在 Cloudflare，点一下就完成，CNAME 记录自动创建，指向你的 pages.dev 地址；
  • 如果托管在别家，按提示去注册商控制台加一条 CNAME 记录。根域名加不了 CNAME 的话，可以改用支持"CNAME 扁平化"的 DNS 服务——这也是我最后把 DNS 托管到 Cloudflare 的原因。

HTTPS 证书由 Cloudflare 自动签发续期，不需要任何操作。建议顺手打开 SSL/TLS 模式里的"完全（严格）"，再开启 Always Use HTTPS。

避坑记录

1. 改了样式没生效？九成是缓存

CSS/JS 会被边缘节点缓存。开发时 Ctrl+F5 强刷；确认部署完成后还不对，就去 Caching → Purge Everything。一劳永逸的办法是给静态资源文件名加内容 hash（style.a1b2c3.css），改版自然穿透缓存。

2. 文件名统一小写 kebab-case

中文文件名、空格、大写字母在 URL 里会变成一堆百分号编码，跨平台大小写敏感还不一致。用 posts/hello-world/index.html 这样的结构最省心，也正好是干净的 URL。

3. 用好 _headers 和 _redirects

Pages 支持在站点根目录放这两个文件做自定义响应头和重定向。比如把旧链接触发 301、给图片加长缓存：

# _headers
/assets/*
  Cache-Control: public, max-age=31536000, immutable

4. 回源与缓存的真相

很多教程把"回源"讲得很玄。对纯静态站来说简单粗暴：请求先到边缘节点，命中缓存直接返回；没命中才回到 Pages 的源站取一次，之后这一片区的用户都能吃到缓存。所以"改了没生效"基本都发生在缓存层，而不是部署层。

写到最后

总成本 0 元，总耗时五分钟上线，之后唯一的运维动作就是写文章。如果你也想折腾一个自己的小站，照着这篇走一遍吧——有问题可以在邮件里找我聊。