Cloudflare Pages 部署指南

Q: Cloudflare Pages 部署指南 的最佳实践有哪些？

Cloudflare Pages 部署指南 的最佳实践包括：通过 .nvmrc 固定 Node 版本 — Cloudflare 构建用它，防止版本漂移；用 _routes.json 限制 Functions 调用 — 跳过静态路径，省 CPU；生产部署启用审批 — 防止意外破损部署。其中首条「通过 .nvmrc 固定 Node 版本 — Cloudflare 构建用它，防止版本漂移」应作为团队默认规范写入 IaC 模板。

将静态站点和全栈应用部署到 Cloudflare Pages，支持 git 集成、预览部署和 Pages Functions。

Cloudflare入门

为什么

Pages 提供无限静态请求、每月 500 次构建免费，以及每个 PR 自动预览 URL。结合 Pages Functions 成为无冷启动的全栈平台，免费额度超越 Vercel/Netlify。

Cloudflare 网络覆盖 125+ 国家的 330+ 城市，服务 20% 的互联网流量。Workers 冷启动为 0ms（基于 isolate），免费套餐覆盖每天 10 万请求。

何时使用

用于 Next.js/Astro/Remix 静态导出、营销站、文档和需要边缘函数的全栈应用。避免需要长运行服务器或 WebSocket 服务器的应用。

如何做

1. 连接仓库 — dash.cloudflare.com → Pages → Create → Connect Git 2. 构建设置 — 框架预设自动检测，设置构建命令 + 输出目录 3. 部署 — push 到 main 触发生产构建，PR 获得预览 URL 4. Pages Functions — 添加 functions/ 目录，文件即路由（/api/* → functions/api/*.ts） 5. 绑定 — wrangler.toml 或面板：KV、D1、R2、Durable Objects 6. 自定义域名 — Pages → Custom domains → 添加（Cloudflare 自动 SSL） 7. 回滚 — 每次部署不可变，面板一键回滚

示例

// functions/api/feedback.ts — Pages Function（边缘） export const onRequestPost = async ({ request, env }) => { const data = await request.json(); await env.DB.prepare("INSERT INTO feedback (msg) VALUES (?)").bind(data.msg).run(); return Response.json({ ok: true }); }; // wrangler.toml（Pages 绑定） [[d1_databases]] binding = "DB" database_name = "feedback-db" # 通过 CLI 部署 npx wrangler pages deploy ./dist --project-name mysite

常见问题

⚠构建命令错误 — 'npm run build' vs 'npx next build'，检查框架预设
⚠Functions 不路由 — functions/ 必须在仓库根，不在 src/
⚠预览部署泄露密钥 — 用生产范围环境变量，非共享

最佳实践

✓通过 .nvmrc 固定 Node 版本 — Cloudflare 构建用它，防止版本漂移
✓用 _routes.json 限制 Functions 调用 — 跳过静态路径，省 CPU
✓生产部署启用审批 — 防止意外破损部署

常见问题解答

什么是Cloudflare Pages 部署指南？它解决什么问题？

将静态站点和全栈应用部署到 Cloudflare Pages，支持 git 集成、预览部署和 Pages Functions。它可帮助开发者在不自建基础设施的前提下完成部署、存储与扩展，是云服务选型的核心参考。

如何在 5 分钟内上手Cloudflare Pages 部署指南？

两步即可跑通：① 连接仓库 — dash.cloudflare.com → Pages → Create → Connect Git；② 构建设置 — 框架预设自动检测，设置构建命令 + 输出目录。建议先用免费套餐验证流程，再接入生产环境。