怎么0 元拥有自己的域名网站？

一、方案介绍

如果你也想过搭建一个属于自己的网站，但被以下问题劝退过：

服务器动辄几百块一年
域名也要几十块
配置复杂，新手劝退
国内备案麻烦

那么这篇文章就是为你准备的。

我要介绍的是 Cloudflare Pages，一个完全免费的静态网站托管服务。它的特点很直接：

完全免费

没有隐藏收费
没有流量限制
没有存储限制

访问速度快

全球 CDN 加速
国内访问相对稳定
自动 HTTPS

部署超简单

连接 GitHub 即可
代码推送自动部署
无需配置服务器

适用场景

个人博客或作品集
项目展示页
前端应用（React/Vue 等打包后）
静态文档站

简单来说，只要你的网站是静态内容（HTML/CSS/JS），就可以用 Cloudflare Pages 免费托管。唯一的限制是：不支持后端代码（Node.js、Python、PHP 等）。

但好消息是，很多现代应用都可以打包成静态文件，比如我现在用的周报系统和 Chat 应用，都是前端项目，完全可以免费部署。

二、完整部署步骤

步骤 1：准备代码

首先，你要有一个可以部署的网站项目。如果你已经有现成的前端项目，可以直接跳过这一步。

如果你还没有项目，可以先从最简单的 HTML 页面开始。创建一个文件夹，里面放一个 index.html：

<!DOCTYPE html><html>  <head>    <meta charset="UTF-8" />    <title>我的网站</title>  </head>  <body>    <h1>欢迎来到我的网站</h1>    <p>这是用 Cloudflare Pages 免费部署的！</p>  </body></html>

把这个文件夹放到方便的位置，比如 D:\my-website。

步骤 2：上传到 GitHub

Cloudflare Pages 需要连接 GitHub 仓库，所以你需要先把代码推送到 GitHub。

2.1 创建 GitHub 仓库

访问 https://github.com
点击右上角的 "+" → "New repository"
填写仓库名称，比如 my-website
选择 Public（公开）或 Private（私有）都可以
点击 "Create repository"

2.2 推送代码到 GitHub

在你的项目文件夹打开命令行（或 PowerShell），执行：

# 初始化 Git 仓库git init# 添加所有文件git add .# 提交git commit -m "初始提交"# 添加远程仓库（替换成你的仓库地址）git remote add origin https://github.com/你的用户名/my-website.git# 推送代码git push -u origin main

如果你推送时遇到超时问题，可能是网络原因。如果你在使用代理工具，可以配置 Git 代理：

git config --global http.proxy http://127.0.0.1:你的代理端口

步骤 3：注册 Cloudflare 账号

访问 https://dash.cloudflare.com
点击 "Sign up" 注册账号
可以用邮箱直接注册，也可以用 Google、GitHub 账号登录

注册完成后，会进入 Cloudflare Dashboard。

步骤 4：创建 Pages 项目

在 Dashboard 左侧菜单找到 Workers & Pages，点击进入
点击 Create application 按钮
选择 Pages 标签
点击 Connect to Git

4.1 连接 GitHub

第一次使用需要授权 Cloudflare 访问你的 GitHub：

点击 Connect GitHub 按钮
会跳转到 GitHub 授权页面
点击 Authorize Cloudflare 授权
授权成功后会回到 Cloudflare 页面

4.2 选择仓库

在 "Select a repository" 下拉菜单中选择你刚才创建的仓库
如果找不到，可以点击 "View all" 搜索
选中后点击 Begin setup

4.3 配置构建设置

这里是关键步骤。根据你的项目类型选择：

纯静态 HTML 项目（无构建步骤）

配置项	填写内容
Project name	随意填写，比如 my-website
Production branch	`main`
Build command	留空
Build output directory	`/`
Root directory	留空

需要构建的项目（React/Vue 等）

如果你的项目需要 npm run build 打包：

配置项	填写内容
Project name	随意填写
Production branch	`main`
Build command	`npm install && npm run build`
Build output directory	`dist`
Root directory	如果项目在子文件夹，填写路径，比如 chat-app

点击 Save and Deploy 开始部署。

步骤 5：等待部署完成

部署过程一般需要 1-3 分钟。你会看到：

Build logs - 构建日志，显示安装依赖和构建过程
Deployment status - 部署状态，显示为 "Success" 就成功了

部署成功后，Cloudflare 会给你一个免费的 .pages.dev 域名，比如：

https://my-website.pages.dev

点击这个链接就能访问你的网站了！

步骤 6：自动部署体验

配置好之后，之后每次你推送代码到 GitHub，Cloudflare 会自动重新部署。

测试一下：

修改你的 index.html，改个标题或内容
提交并推送：

git add .git commit -m "更新内容"git push

回到 Cloudflare Dashboard，你会看到新的部署正在进行
几分钟后，刷新你的网站，内容已经更新了

这就是 CI/CD（持续集成/持续部署）的魅力，完全自动化。

步骤 7：自定义域名（可选）

如果你有自己的域名，可以绑定到 Cloudflare Pages。

7.1 添加域名到 Cloudflare

在 Cloudflare Dashboard 点击 Add a site
输入你的域名，比如 example.com
选择 Free 免费计划
Cloudflare 会给你两个 NS 服务器地址
去你的域名注册商那里，把 NS 服务器改成 Cloudflare 给你的地址
等待生效（一般几小时到 24 小时）

7.2 绑定到 Pages

回到 Workers & Pages
进入你的项目
点击 Custom domains
点击 Set up a custom domain
输入你的域名，比如 www.example.com 或 example.com
点击 Activate domain

完成！现在你的网站可以用自己的域名访问了。

如果你没有域名，直接用免费的 .pages.dev 域名也完全够用。

总结

用 Cloudflare Pages 免费部署网站，就是这么简单：

准备好代码（静态 HTML 或前端项目）
推送到 GitHub
在 Cloudflare Pages 连接仓库
配置构建设置
自动部署完成

整个过程大概 10 分钟搞定，之后每次推送代码自动更新，完全免费。