Cloudflare Pages 介绍（2025 技术版）

By Leeting Yan

Cloudflare Pages 是 Cloudflare 提供的 前端构建 + 全局边缘网络部署 的托管服务，主要用于:

  • 静态网站（Static Site）
  • SPA（React、Vue、Next.js 静态导出）
  • 前后端分离的 Web 应用
  • JAMstack 产品
  • SaaS Dashboard、Docs、Landing Page
  • 与 Cloudflare Workers 组合的全栈应用

Cloudflare Pages 利用 Cloudflare 数百个边缘节点（CDN + Compute），提供 极低延迟、高可用、自动 HTTPS、零服务器维护 的发布体验。

1. 核心理念（Key Philosophy）

Cloudflare Pages 基于 边缘计算（Edge）+ 静态资源高速分发（CDN）+ 无服务器（Serverless） 的统一模型：

“让前端在最靠近用户的地方执行，让后端以 serverless 方式组合。”

因此 Pages 的目标是让开发者：

  • 不要维护服务器
  • 不要自己做 CI/CD
  • 不要关心全球加速
  • 不要关心 TLS、缓存、部署区域
  • 只需：推代码 → 自动构建 → 自动在全球部署

2. Cloudflare Pages 的组件体系

Cloudflare Pages 包含以下核心模块：

2.1 Build System（构建系统）

  • 自动运行 npm/yarn/pnpm/turbo 构建
  • 支持预设框架：Next.js、Nuxt、Astro、Hugo、SvelteKit 等
  • 支持自定义构建命令
  • 自动依赖缓存（加速 3-10 倍）

2.2 Static Deployment（静态托管）

  • 自动同步产物目录（如 dist/、build/）
  • 基于 Cloudflare 全球 CDN（超过 300+ PoP）
  • 内置自动压缩（Brotli、Gzip）
  • 边缘缓存：自动/手动 Cache-Control

2.3 Functions（前端＋边缘函数）

Pages Functions ≈ Workers Functions 的轻量版本，用于：

  • API 请求
  • SSR（Next.js RSC）
  • Auth & Session
  • 数据读取（D1/Hyperdrive/KV）

常用文件结构：

/functions/
  └── api
      └── users.ts

2.4 数据存储（通过 Bindings 集成）

Pages 可绑定 Cloudflare 的 Serverless 数据层：

存储 用途
KV 配置、Token、缓存
D1（SQLite serverless） SaaS 配置、轻量 DB
R2（S3 兼容） 图片、视频、静态文件
Durable Objects 房间/会话/匹配系统
Hyperdrive 外部数据库加速 (Postgres/MySQL Proxy)

2.5 Preview 环境

每个 Git 分支自动获得一个独立 URL：

例：

https://feature-login.pages.dev

用于：

  • QA
  • 产品验收
  • 业务演示
  • PR 自动预览

2.6 环境管理（Environment Variables）

支持：

  • Production Environment
  • Preview Environment
  • Local Development via wrangler

3. Cloudflare Pages 的工作流程（CI/CD Pipeline）

完整流程如下：

  1. GitHub / GitLab 关联
  2. Push → Cloudflare 自动触发构建
  3. 自动安装依赖（带缓存）
  4. 执行构建命令
  5. 输出 dist/
  6. 自动部署到全球边缘 CDN
  7. 自动分配 HTTPS
  8. Preview 分支自动生成测试 URL

整个过程 20–60 秒即可部署一次。

4. Cloudflare Pages 的优势（Why Pages?）

4.1 真正的全球边缘网络

Cloudflare Edge 节点覆盖：

  • 北美 / 欧洲：< 20ms
  • 亚洲：10-40ms（包括中国香港、日本、新加坡、韩国）
  • 拉美、非洲也有覆盖

比 Vercel/Netlify 显著更快的 全局一致性。

4.2 极低成本或完全免费

Cloudflare Pages 免费版提供：

  • 无限站点
  • 无限带宽
  • 无限请求
  • 无限团队协作
  • 全局 CDN + HTTPS

这在 Vercel/Netlify 上必须付费。

4.3 性能极强的边缘函数（Functions/Workers）

Cloudflare Workers 是目前全球最快的 serverless runtime：

  • 冷启动极低 (<1ms)
  • 全局分散
  • WASM 原生支持

用于：

  • API Proxy
  • SSR
  • OAuth
  • 多租户 SaaS Auth

4.4 生态统一（Workers + KV + R2 + D1）

Pages 与 Cloudflare 的 serverless 生态高度融合：

  • 无缝绑定存储
  • 无缝调用 Worker
  • 无缝做 SSR

等同于：

“前端 + 后端 + 数据 + 缓存 = 一个服务”

4.5 无服务器 / 不必维护运维

无需：

  • 自己配服务器
  • 自己装镜像
  • 自己管理容器
  • 自己买 CDN

Cloudflare 自动维护 100% 的基础设施。

4.6 安全级别极高

Cloudflare 提供：

  • Bot 管理
  • WAF（Web Application Firewall）
  • Rate Limiting
  • DDoS 防护
  • 防爬虫策略
  • Zero Trust 访问控制

这是 Vercel/Netlify 较弱的部分。

5. Pages 适合的场景（Use Cases）

场景 推荐程度 原因
静态网站/博客 ⭐⭐⭐⭐⭐ 免费、快、无运维
Landing Page / Docs ⭐⭐⭐⭐⭐ 边缘加速 + 部署快
SaaS Dashboard ⭐⭐⭐⭐⭐ Functions + Workers 即全栈
前后端分离的 Web 应用 ⭐⭐⭐⭐⭐ API 走边缘函数
Next.js 全栈应用 ⭐⭐⭐⭐ 支持部分 SSR（2024+逐步增强）
高并发 Serverless API ⭐⭐⭐⭐ Workers 强大
带文件上传的应用 ⭐⭐⭐⭐ R2 兼容 S3

不适合的：

业务类型 原因
实时长连接（WS 大量连接） Workers 支持有限、高阶功能需 Durable Objects
大型数据库（TB 级） D1 仍 ~SQLite 级规模
重 CPU 后端（AI/ML 推理） Workers CPU 有限制

6. Pages 与 Cloudflare Workers 的关系

Cloudflare Pages = 静态托管
Cloudflare Functions = Workers Lite

两者组合可构建全栈应用：

Frontend: Cloudflare Pages
Backend: Cloudflare Workers / Pages Functions
Database: D1 / R2 / KV / Hyperdrive
Auth: Zero Trust / Token / JWT

这样的架构不需要任何传统服务器。

7. Pages 与 Vercel / Netlify / Render 的对比（简化版）

维度 Cloudflare Pages Vercel Netlify Render
免费额度 ⭐⭐⭐⭐⭐ 无限 ⭐ 支持有限 ⭐⭐ 一般 ⭐⭐ 有免费限
CDN 全球 ⭐⭐⭐⭐⭐ ⭐⭐⭐ ⭐⭐⭐ ⭐⭐⭐
Serverless 性能 ⭐⭐⭐⭐⭐ Workers 最快 ⭐⭐⭐ Lambda 较慢 ⭐⭐ ⭐⭐⭐ AWS 级
SSR ⭐⭐⭐ 中强 ⭐⭐⭐⭐⭐ 最佳 ⭐⭐ ⭐⭐⭐
数据库 D1, KV, R2 Postgres（付费） 限制很多 一流（Managed Postgres）
多租户 SaaS ⭐⭐⭐⭐⭐ 边缘更合适 ⭐⭐⭐ ⭐⭐⭐ ⭐⭐⭐⭐
成本 最省 昂贵 中等 中等

结论：
Cloudflare Pages = 最强 CDN + 最省钱 + 最高可扩展性。
Vercel = 最强 Next.js / 最适合 SSR 重度项目。

8. Pages 的多租户 SaaS 架构建议（你当前写的项目相关）

推荐架构：

用户 → Cloudflare CDN/Pages
         → Pages Functions（API & SSR）
              → KV（租户配置）
              → D1（租户数据）
              → R2（图片/资源）
              → Durable Objects（会话/房间）
              → Hyperdrive（连 Postgres）

优势：

  • 每个租户访问最近边缘节点
  • 配置秒级下发到 KV
  • 基本抗 10 万 QPS 无压力
  • 成本低至每月 0–5 美元

9. 部署和使用流程（5 分钟快速入门）

1) 连接 GitHub/GitLab

Cloudflare Dashboard → Pages → Create Project

2) 设置构建命令与输出目录

例如：

Build command: npm run build
Output: dist

3) 自动部署

每次 push → 自动构建 → 自动发布

4) 手动触发构建（可选）

Cloudflare API 或 Dashboard

10. 费用模型（非常有优势）

Cloudflare Pages 免费版：

  • 不限站点数
  • 不限带宽
  • 不限请求量
  • 不限部署
  • 不限团队协作
  • 全局 CDN + HTTPS

付费只在你需要：

  • Workers 专业配额（更大 CPU 时间）
  • D1 数据库更大存储
  • R2 大量对象存储
  • Durable Objects 大规模使用

一般 SaaS Dashboard 一年成本 < 100 USD。

11. 总结（为什么 2025 年 Pages 大火）

Cloudflare Pages 之所以在 2023–2025 迅速成为前端/SaaS 的重要平台，是因为：

  1. 真正免费不坑人（无限带宽）
  2. 全球 CDN 加速比 Vercel/Netlify 更强
  3. Workers 生态极强（全球 <1ms 冷启动）
  4. D1、R2、KV 构成完整服务器替代层
  5. 多租户 SaaS 极度适配（边缘隔离）
  6. 无运维、零复杂度