翻译说明:本文为 MobileSetting 原文 的繁体中文转简体中文翻译。除繁简转换、明显错别字和排版外,保留原文标题、事实、观点、数字、结构和第一人称表达。
Cloudflare Pages 免费计划提供无限静态网站部署、每月 500 次 build、全球 CDN,并支援自定义域名。连接 GitHub 后 5 分钟内可以上线,零月费。Next.js、Astro、Hugo 等主流框架开箱即用,香港用家延迟低至 20-50ms,系 2026 年性价比最高的静态建站选择。
唔少人以为建网站一定要付 server 月费。静态网站其实可以完全免费,而且速度比一般共享主机更快。Cloudflare Pages 系目前最完善的免费静态建站平台,凭借 Cloudflare 全球 300+ 节点网络,任何地方访问都极速。呢篇文章教你 5 分钟部署,并讲清楚免费计划嘅实际限制。
Cloudflare Pages 系咩?点解适合香港用家?
Cloudflare Pages 系 Cloudflare 推出嘅静态网站部署服务。「静态」意思系网站内容系预先生成嘅 HTML/CSS/JS 文件,唔需要即时查询资料库,因此可以直接放喺 CDN 上全球分发。
点解特别适合香港用家?
延迟极低。 Cloudflare 喺香港有多个 PoP(Point of Presence)节点,本地用家访问时延迟低至 20-50ms,比一般美国 server(150-200ms)快 3-4 倍。
无限请求。 免费计划唔限制流量或带宽,唔会因为访问量增加而收费,对刚起步嘅个人网站或 side project 系大优点。
自定义域名免费。 连接自己的域名完全免费,包括自动 SSL 凭证,其他平台可能要付费才有呢个功能。
DDoS 防护内置。 作为世界最大 CDN 供应商之一,Cloudflare Pages 天然继承 DDoS 防护,唔需要额外付费。
5 步部署静态网站
Step 1:连接 GitHub
登入 Cloudflare Dashboard(dash.cloudflare.com),左侧选单拣「Pages」,点击「Create a project」。
选择「Connect to Git」,授权连接你的 GitHub 帐号。选好你想部署的 repository,点击「Begin setup」。
Step 2:选择框架预设
Cloudflare Pages 自动侦测大部分框架。如果侦测唔到,手动拣:
- Next.js:选「Next.js」
- Astro:选「Astro」
- Hugo:选「Hugo」
- 纯 HTML:选「None」(唔需要 build)
Step 3:配置 Build Settings
系统会预填 build 指令,一般唔需要修改:
- Build command: 例如
npm run build(Next.js)、astro build(Astro)、hugo(Hugo) - Build output directory: 例如
out或.next(Next.js)、dist(Astro)、public(Hugo) - Root directory: 通常留空(即 repo 根目录)
如果用 Next.js 静态导出,记得喺 next.config.js 设置 output: 'export',否则 Pages 唔支援 Server Components。
Step 4:Deploy
点击「Save and Deploy」。Cloudflare 会自动:
- Clone 你的 repo
- 安装依赖(npm install / yarn)
- 执行 build 指令
- 将 output 推上全球 CDN
首次 deploy 约需 1-3 分钟。之后每次 push 到 GitHub,Cloudflare Pages 自动重新部署。
Step 5:设置自定义域名
部署完成后,你会有一个 *.pages.dev 的免费域名。如需用自己嘅域名:
- Pages 项目页面点击「Custom domains」
- 输入你的域名(例如
yoursite.com) - 如果域名喺 Cloudflare 管理,自动配置;如在其他 registrar,按提示加 CNAME record
- SSL 凭证自动配置,几分钟生效
支援框架列表
| 框架 | Build 指令 | Output 目录 | 备注 |
|---|---|---|---|
| Next.js(静态) | next build |
out |
需设 output: 'export' |
| Astro | astro build |
dist |
完全支援 |
| Hugo | hugo |
public |
支援 extended 版本 |
| Gatsby | gatsby build |
public |
支援 |
| Nuxt(静态) | nuxt generate |
.output/public |
需静态模式 |
| SvelteKit(静态) | vite build |
build |
需 adapter-static |
| VitePress | vitepress build docs |
docs/.vitepress/dist |
适合文档站 |
| 纯 HTML | 无需 build | /(根目录) |
直接部署 |
免费 Plan 限制是什么?
了解限制系避免踩坑嘅关键。 免费计划唔系无限,有几个重要上限:
每月 500 次 Build: 每次 push 到 GitHub 触发一次 build。对个人网站通常绰绰有余,但如果系 CI/CD 频繁部署嘅项目需要留意。超出后需升级到 $20/月嘅 Pro Plan(无限 builds)。
Pages Functions 调用: 如果你用 Cloudflare Pages Functions(相当于简单 serverless 函数),免费计划每日 100,000 次调用。超出后需购买 Workers Paid Plan($5/月起)。
Concurrent Builds: 免费计划同一时间只能跑 1 个 build 任务,如果你有多个项目同时 push,会排队。Pro Plan 支援 5 个并行。
Branches: 支援无限 preview branches,每个 branch push 都会有独立 preview URL,方便 staging 测试。免费计划同样支援。
Cloudflare Pages vs Vercel vs Zeabur
| 功能 | Cloudflare Pages | Vercel | Zeabur |
|---|---|---|---|
| 静态网站 | 免费,无限带宽 | 免费(有流量上限) | 支援(按资源收费) |
| 后端 API | Pages Functions(有限) | Serverless Functions | 完整后端支援 |
| 资料库 | D1(SQLite,beta) | 需整合外部 | PostgreSQL/MySQL 一键建立 |
| 香港节点 | 香港 PoP(CDN) | 香港 Edge(CDN) | 香港 Region(真实 server) |
| 月费 | 免费起步 | 免费起步($20 Pro) | $5 起 |
| Next.js 支援 | 静态模式(限制) | 完整支援(官方合作) | 完整支援 |
| 适合 | 纯静态网站、Hugo、Astro | Next.js 全栈 | 后端服务、bot、API |
选择逻辑:
- 静态内容展示站:Cloudflare Pages
- Next.js 全栈(需要 SSR/Server Actions):Vercel
- 后端 API、资料库、长期运行服务:Zeabur
何时需要从 Pages 升级到 Zeabur?
Cloudflare Pages 功能强,但系静态优先平台。以下情况需要转用后端服务平台:
需要持续运行的后端 API
Pages Functions 系 Serverless,每次请求启动,冇状态、冇持久连接。如果你的应用需要 WebSocket、长时间任务、定时排程,Pages Functions 唔适合。
需要资料库
D1(Cloudflare 的 SQLite 资料库)仍系 beta 状态,功能有限制。如果需要 PostgreSQL、MySQL、Redis,需要另外连接外部资料库服务,增加复杂度。
Telegram Bot 或排程任务
Bot 需要持续运行监听 webhook,排程任务(cron job)需要 server 环境。Cloudflare Workers 可以做到部分,但复杂逻辑管理起来费事。
跑 Python / Django / FastAPI 后端
Pages 唔支援 Python。Python 后端需要真实 server 环境。
呢类场景,Zeabur 系最直接嘅升级路径。 HK 节点、支援所有语言、一键连 DB、Git 自动部署,同 Cloudflare Pages 嘅工作流一脉相承,切换成本低。
一个典型架构系:静态前端继续放 Cloudflare Pages(免费、全球极速),后端 API 和资料库放 Zeabur(HK 节点、低延迟),两者各司其职,成本最优。
常见问题
Q:Cloudflare Pages 支援 Next.js App Router 吗?
A:部分支援。Next.js 静态导出(output: 'export')完全支援;但 Server Components、Server Actions、App Router 嘅动态功能唔支援,因为 Pages 系静态平台。需要完整 Next.js 功能建议用 Vercel 或 Zeabur。
Q:免费计划可以用几多个网站?
A:Cloudflare Pages 免费计划唔限制项目数量,可以建立多个独立嘅 Pages 项目。但同一时间 Concurrent Build 只有 1 个。
Q:Cloudflare Pages 的 SSL 凭证需要付费吗?
A:完全免费。包括自定义域名的 SSL 凭证,自动续期,唔需要任何操作。
Q:Pages 适合做电商吗?
A:静态电商(例如 Shopify Hydrogen 静态模式、或者前端静态 + 第三方支付 API)可以用 Pages。但如果需要自建后台、管理库存、处理订单逻辑,需要后端服务配合。纯展示型目录电商系合适的。
💡 读者限时优惠
输入优惠码
zeabur10结帐即享 10% 折扣。Starter Plan 另有每月 $5 免费 credits,轻量 side project 零成本试用。优惠码长期有效,但随时可能更改。




