把纯静态博客免费放到 Cloudflare Pages

三种部署方式，怎么选

方式	适合场景	代价
控制台直接上传	零构建的静态站点、临时预览	每次更新都要重新拖拽整个目录
Git 仓库自动构建	有构建步骤的项目、要多人协作	需要多维护一个仓库与构建配置
Wrangler CLI	想接进 CI、脚本化发布	本地需要 Node 环境与授权

如果站点和本站一样是「零构建」的纯静态资源，第一种方式最省事：把文件夹拖进控制台即可，十几秒后就能拿到 *.pages.dev 域名。

方式一：直接上传整个目录

登录 Cloudflare 控制台，进入 Workers & Pages → Create → Pages → Upload assets。
把项目文件夹里的全部文件（含 assets/、posts/）拖进去。
项目名会变成访问域名，例如 my-blog.pages.dev；文件名中的 index.html 会自动作为目录默认页。

两个容易踩的坑：不要只拖最外层文件夹，要保证站点根目录下的 index.html 就在上传内容的根层级；另外文件名大小写敏感，Linux 边缘节点上 Assets/ 与 assets/ 是两个目录。

方式二：让 Git 自动构建

在 Pages 里连接 GitHub / GitLab 仓库后，每次 push 都会触发一次构建。零构建的项目只要把构建命令留空、输出目录填 / 就行：

# 构建配置（纯静态站点）
Framework preset:     None
Build command:        (留空)
Build output directory: /

如果确实有构建步骤（比如 Vite、Next.js 静态导出），就填 npm run build 和对应的输出目录。每个 Pull Request 都会自动生成一个独立的预览地址，用来做评审非常方便。

方式三：Wrangler CLI

想把它接进 CI 流水线，用 Wrangler 一条命令即可发布当前目录：

# 安装并登录（Node 18 以上）
npm install -g wrangler
wrangler login

# 发布当前目录为生产环境
wrangler pages deploy . --project-name=my-blog

# 发布到预览环境（不计入生产）
wrangler pages deploy . --project-name=my-blog --branch=preview

两个特殊文件：_headers 与 _redirects

Pages 会在构建时读取站点根目录下的这两个文件，无需任何配置。 _headers 用来加安全响应头与缓存策略， _redirects 用来做重定向与 SPA 兜底。

# _headers —— 静态资源长缓存，HTML 不缓存
/assets/*
  Cache-Control: public, max-age=31536000, immutable

# 全局安全头
/*
  X-Content-Type-Options: nosniff
  Referrer-Policy: strict-origin-when-cross-origin
  X-Frame-Options: SAMEORIGIN

# _redirects —— 旧链接迁移示例
/blog/:slug    /posts/:slug    301
/old-home      /               301

缓存策略的关键点是：文件名带哈希的资源可以 immutable，而没有构建流程的站点不要给 HTML 设长缓存，否则更新后用户会长时间看到旧页面。

自定义域名与 HTTPS

域名已经在 Cloudflare 托管的话，在 Pages 项目的 Custom domains 里添加即可， DNS 记录与证书都会自动配好；域名在别处则需要按提示加一条 CNAME。收尾时记得顺手配置三件事：

开启 Always Use HTTPS，把 http 请求重定向到 https。
给 *.pages.dev 的默认域名加上 noindex，避免和主域名重复收录。
把文章的 canonical 与 og:url 换成真实域名，社交平台抓取才不会失败。

整个过程没有任何服务器需要运维，免费额度（每月 500 次构建 + 无限带宽）对个人博客完全够用。唯一要付的代价是：发布之后记得刷新一次 CDN 缓存，或者在文件名里带上内容哈希。