Cloudflare免费无服务部署之Pages-洛洛资源库

Cloudflare 免费无服务器部署方案

项目简介

Cloudflare Pages

Cloudflare Pages 是一个用于部署静态网站和前端应用的平台。它专注于提供快速、安全的全球静态内容交付。你可以将你的代码存储在 Git 仓库（如 GitHub、GitLab、Bitbucket）中，Pages 会自动构建和部署你的应用。
核心特点:
- 自动构建与部署: Pages 能够自动检测 Git 仓库的变化，并根据你的配置构建和部署你的静态站点。
- 全局 CDN: 利用 Cloudflare 的全球 CDN 网络，确保你的站点在全球范围内快速加载。
- 免费套餐: Cloudflare Pages 提供了一个慷慨的免费套餐，非常适合个人项目和小型网站。
- 自定义域名: 支持自定义域名，你可以将 Pages 部署的站点绑定到你自己的域名上。
适用场景:
- 个人博客
- 文档站点
- 作品集网站
优势:
- 易于使用: 非常容易上手，配置简单。
- 高性能: 利用 Cloudflare 的 CDN 网络，提供出色的性能。
- 自动化: 自动构建和部署，节省时间和精力。
- 免费套餐: 免费套餐适合大多数小型项目。
- 与 Git 集成: 无缝集成 Git 仓库，方便代码管理。

Cloudflare Workers

Cloudflare Workers 是一个无服务器计算平台，允许你在 Cloudflare 的全球网络边缘运行代码。你可以在靠近你的用户的地方运行 JavaScript、WebAssembly 和其他代码，从而降低延迟并提高性能。
核心特点:
- 边缘计算: 代码在全球 Cloudflare 数据中心运行，靠近用户，降低延迟。
- 无服务器: 无需管理服务器，按需付费。
- 支持多种语言: 支持 JavaScript、WebAssembly (WASM) 和其他语言。
- 全局变量和绑定: 可以绑定到 Cloudflare 的其他服务，如 Workers KV (键值存储)、D1数据库。
- 中间件: 可以用作 HTTP 请求和响应的中间件，修改请求或响应的内容。
- WebSocket 支持: 支持 WebSocket，可以构建实时应用。
- 流处理: 能够处理大型数据流。
适用场景:
- API 网关
- A/B 测试
- 身份验证
- 动态内容处理
- WebSocket 应用
- URL 重定向
- 安全策略执行
- 请求重写和路由
优势:
- 高性能: 边缘计算降低延迟。
- 可扩展性: 自动扩展，无需担心服务器容量。
- 灵活性: 可以构建各种应用程序，从简单的 HTTP 中间件到复杂的 API 网关。
- 全球网络: 利用 Cloudflare 的全球网络，覆盖全球用户。
- 低成本: 按需付费，节省服务器成本。

Pages vs. Workers:

特性	Cloudflare Pages	Cloudflare Workers
定位	静态网站和前端应用部署	无服务器计算平台
用途	部署和托管静态网站，自动构建和部署	运行服务器端代码，处理 HTTP 请求，实现各种功能，如 API 网关、身份验证等。
技术	HTML, CSS, JavaScript, 前端框架 (React, Vue, Angular 等)	JavaScript, WebAssembly (WASM), 等
部署方式	Git 仓库 (GitHub, GitLab, Bitbucket)	Wrangler CLI, Cloudflare API
核心价值	易于使用，高性能，自动化部署	灵活性，可扩展性，边缘计算
典型用例	博客，文档站点，作品集网站，单页应用	API 网关，A/B 测试，身份验证，自定义错误页面，图像优化
上手难度	非常容易	需要一定的编程知识
免费套餐	提供慷慨的免费套餐	提供有限的免费套餐 (请求数、执行时间等有限制)

在很多情况下，Pages 和 Workers 可以一起使用。例如，你可以使用 Pages 部署你的前端应用，然后使用 Workers 来处理 API 请求或实现其他服务器端逻辑。这种组合可以让你充分利用两者的优势，构建高性能、可扩展的应用程序。

免费套餐限制

特性	Cloudflare Pages (免费)	Cloudflare Workers (免费)
网站数量	无明确限制	N/A
构建次数	每天最多 500 次	N/A
构建时间	每次最长 15 分钟	N/A
带宽	无明确限制，遵循合理使用原则	N/A
请求	无明确限制，遵循合理使用原则	每天最多 100,000 个
存储空间	无明确限制，遵循合理使用原则	N/A
CPU 执行时间	N/A	每个请求最多 10 毫秒
Durable Objects	N/A	不支持
自定义域名	支持	N/A (需要单独配置路由)
Cron Triggers	N/A	不支持
支持	社区支持	社区支持

虽然有这些限制，但对于小型项目、个人网站和学习来说，免费套餐已经足够使用。

Cloudflare 账号

如果还没有 Cloudflare 账号，请先注册一个免费账号：
这一部分比较简单而且基础，就不详细展开讲了，邮箱注册就可以。cloudflare对邮箱这块管的比较松，自建邮箱也可以，只要可以接收验证码。https://dash.cloudflare.com/sign-up

Pages部署步骤

点击左侧的 Workers 和 Pages
点击 创建
点击 Pages
选择创建方式，如果你的项目已经在github上或者是希望放到github或者需要合作开发，就选第一个。如果你的项目是个人项目，推荐选第二个。
这里用直接上传，做演示。
这里需要输入项目名，并点击 创建项目。
注意：如果你有域名，这里随便输，之后会用自定义域。如果你没有，这里项目名决定了之后所生成的免费域名。之后所生成的域名为：项目名+(随机字符串)+.pages.dev。输入完成后检查一下，如果你的项目名和其他的重名了，Cloudflare会自动加上随机字符串，这个不能去除，除非你跟换项目名。

与其他人的项目重名：

与其他人的项目不重名：
点击 从计算机中选择。

此时有两个选项，两个都可以，我以上传压缩文件做演示。
当所有文件上传成功后，点击 部署站点
点击链接，访问网站。一般第一次部署需要一些时间。
更新项目。继续点击左侧的 Workers 和 Pages。
进入 你的项目。
点击 创建部署
此时，现在的页面和第七步的页面是一样的。
绑定个人域名（可选）
回到你的项目
点击 自定义域 并点击 设置自定义域

输入你的自定义域（域名可以没有托管到cloudflare上）

如果，你的域名已经托管到了cloudflare上，直接确认即可，然后等10分钟，你的自定义域就设置好了。

如果，你的域名没有托管到cloudflare上，你需要自行设置CNAME

点击 开始CMANE设置

在你的DNS服务商中添加这条CNAME设置，检查DNS记录是自动的，你不需要点击这个按钮。