零基础用 Cloudflare 免费搭建网站教程

不需要买服务器、不需要懂代码、连域名都可以免费用，30分钟上线你的第一个网站

一、什么是 Cloudflare？

如果你是新手，先把 Cloudflare 理解为"一站式网站服务工具"就好。它能帮你做三件事：

• 托管网站：把你的网页文件放到全球 300 多个节点上，世界各地都能快速访问

• 管理域名：比绝大多数域名商的 DNS 更快更稳定

• 保护网站：自带 DDoS 防御、免费 SSL 证书、防火墙规则

最关键的是：个人使用完全免费，不用绑定信用卡。如果你是独立开发者或个人站长，这个方案能把你的月成本从几十几百元直接降到 0。

很多独立开发者用这套方案跑 MVP（最小可行产品），日活几百人以内，Cloudflare 的免费额度根本用不完。

二、开始前的准备工作

2.1 你需要准备什么？

如果你还没有自己的网站文件：可以用 AI（如 ChatGPT、豆包、DeepSeek）帮你写一个简单的静态网页。你只需要告诉 AI"帮我写一个个人简介页面"或"帮我写一个产品展示页"，然后把代码保存下来就行。

2.2 确认你的网站文件格式

你的网站根目录里必须有一个 index.html 文件，这是网站的默认首页。如果你的主页文件叫其他名字（比如 home.html），需要把它改成 index.html。

三、方法一：最简方式------直接上传文件（3分钟上线）

这个方法适合只有几个文件、不常更新的简单网站。

第1步：注册 Cloudflare

访问 Cloudflare 官网，用邮箱注册即可。

第2步：进入 Workers & Pages

登录后，在左侧菜单栏找到 Workers & Pages，点击进入。

第3步：创建应用

点击蓝色的 Create application 按钮。

你会看到两个选项卡：

• Connect to Git：连接 GitHub 仓库（适合需要自动更新的网站）

• Direct Upload：直接上传文件（最简单）

选择 Direct Upload，直接把你准备好的网站文件夹拖拽到页面上就行。

注意：如果你的网站是单页应用（比如用 React 或 Vue 写的），记得勾选"单页应用选项"，否则刷新页面时会报 404 错误。

第4步：部署完成

上传成功后，Cloudflare 会自动生成一个公开访问的网址，格式是 你的项目名.pages.dev。点击这个地址，就能看到你的网站了。

就这么简单，不需要任何命令行操作。

四、方法二：连接 GitHub------更新网站更简单（推荐）

如果你的网站会经常更新内容，推荐用这个方法。配置好之后，以后每次你修改完代码推送到 GitHub，网站就会自动更新，不需要再手动上传。

第1步：把你的网站代码放到 GitHub 上

如果你还没有 GitHub 账号，先去 github.com 注册一个。

新建一个仓库（Repository），把你的网站文件上传进去。

新手提示：如果你不知道怎么用 Git 命令行，可以直接在 GitHub 网页上点击"Add file"->“Upload files”，把文件夹拖进去就行。

第2步：在 Cloudflare 连接 GitHub

回到 Cloudflare 的 Workers & Pages 页面，点击 Create application。

这次选择 Connect to Git 选项卡。

点击 Connect GitHub 按钮，授权 Cloudflare 访问你的 GitHub 账号。授权完成后，选择你刚才创建的仓库。

第3步：配置构建设置

在 Set up builds and deployments 页面，填写以下信息：

如果你的网站是用框架构建的（如 Vue、React、Hugo、Hexo），Framework preset 要选对应的框架。

点击 Save and Deploy，等待 1-2 分钟，部署就完成了。

第4步：以后如何更新网站？

之后你只需要：

1. 在本地修改网站文件

2. 推送到 GitHub 仓库

3. Cloudflare 会自动检测到变化，重新构建部署

全程不需要打开 Cloudflare 网页，网站内容自动刷新。

五、绑定自定义域名（可选，但推荐）

Cloudflare 给你的是 xxx.pages.dev 域名。如果你有自己的域名（比如 example.com），绑上去之后看起来更专业，而且国内访问更稳定。

域名从哪里买？

去 NameSilo、阿里云、腾讯云等平台买一个。最便宜的 .xyz 或 .top 域名一年也就十几块钱。这是整个方案里唯一可能需要花钱的地方。

第1步：把域名托管到 Cloudflare

在 Cloudflare 首页点击 Add a Site，输入你的域名。

选择免费套餐（Free Plan）。

Cloudflare 会扫描你域名的现有 DNS 记录，确认后继续。

系统会给你两个 NameServer 地址，长得像这样：

• jake.ns.cloudflare.com

• lola.ns.cloudflare.com

第2步：去域名注册商改 DNS 服务器

登录你买域名的网站，找到域名管理页面，把 NameServer（DNS 服务器）从原来的地址改成 Cloudflare 给的这两个地址。

不同域名商的操作界面不一样，但都能找到"修改 NameServer"的选项。如果不确定，问一下 AI 或客服。

第3步：等待生效并绑定域名

DNS 修改后，通常几分钟到几小时生效。当 Cloudflare 首页显示你的域名为 Active（绿色打勾）时，说明托管成功了。

然后回到你的 Pages 项目，点击 Custom domains（自定义域），输入你的域名，点击添加。Cloudflare 会自动帮你配置好 DNS 和 SSL 证书。

六、进阶：用 Cloudflare Workers 加一点后端功能

如果你的网站不只是静态展示，还需要"存用户数据"、“发邮件”、"生成激活码"这类功能，可以用 Cloudflare Workers 配合 Pages 实现。

架构思路：

• Pages：放前端页面（HTML/CSS/JS）

• Workers：处理后端逻辑（写数据库、发邮件、接支付回调）

• D1 数据库：存用户数据（免费版 5GB 存储）

• KV 存储：存激活码、配置项等

这套组合非常适合验证产品 MVP，免费额度足够日活几百人的应用。

快速上手：

bash

npm create cloudflare@latest my-api cd my-api 

然后按照提示配置，就可以写你的 API 代码了。

如果觉得这部分内容对你有用，可以留言告诉我，我会专门出一篇 Pages + Workers 全栈教程。

七、常见问题

Q1：上传后访问显示 404？

检查你的网站根目录有没有 index.html 文件，文件名必须完全一致（区分大小写）。

Q2：国内访问慢怎么办？

可以绑定自己的域名，因为 pages.dev 域名在国内有时会被干扰。另外，Cloudflare 在国内的节点虽然没有官方加速，但比 GitHub Pages 稳定得多。

Q3：我的是动态网站（需要数据库），能用这个方案吗？

静态网站可以直接用 Pages。如果你需要数据库和动态功能，可以用 Pages + Workers + D1 的组合方案。简单说就是：前端放 Pages，后端用 Workers 写 API，数据存 D1 数据库。

Q4：能用来放 WordPress 吗？

不能。WordPress 需要 PHP 和 MySQL，Pages 只托管静态文件。但你可以用 WordPress 生成静态页面后再上传。

Q5：免费额度够用吗？

个人博客、企业官网、小工具类网站完全够。以下是免费的额度：

• 请求次数：Workers 每天 10 万次

• 带宽：无限

• 构建次数：每月 500 次

• 数据库：5GB

对绝大多数个人项目来说，这个额度根本用不完。

八、总结

对于个人网站、博客、产品展示页、小工具来说，Cloudflare Pages 是目前性价比最高的托管方案。

你现在只需要做三件事：

1. 去 Cloudflare 注册一个账号

2. 准备好你的网站文件（或让 AI 帮你写一个）

3. 按照上面的步骤上传

30 分钟后，你的网站就会上线。不需要服务器、不需要复杂的配置、不需要花钱。