别再租服务器了！白嫖腾讯 EdgeOne，免费搭一个自己的博客

先说结论

这套方案跑通之后，我每天写完文章只需要 git push 一下，大概一分钟，线上博客就自动更新了。

• 服务器费用：0 元（没有服务器）
• 托管费用：0 元（Gitee 免费仓库 + EdgeOne Pages 免费额度）
• HTTPS 证书：0 元（平台自动签发续期）
• 评论 + 访问统计：0 元（边缘函数 + Blob 存储，免费额度足够个人博客用到天荒地老）
• 唯一的开销：一个域名，几十块钱一年

更关键的是国内访问速度。很多教程教你用 GitHub Pages / Vercel / Netlify，问题是国内访问要么慢、要么干脆打不开。这套方案走的是腾讯 EdgeOne 的国内边缘节点，速度是实打实的快。

整体架构

先看全景图，知道自己每一步在干什么：

 你（写文章）
    │  git push
    ▼
 Gitee 仓库（存代码）
    │  push 触发自动构建
    ▼
 EdgeOne Pages（构建 + 托管 + 边缘节点）
    │  hugo --gc --minify 生成静态页
    ▼
 访客浏览器
    ├── 静态页面（HTML/CSS/JS） ← 秒开
    ├── /api/stats  ─┐
    └── /api/comment ┴→ 边缘函数 → Blob 存储（评论、浏览量、访客数）

分工非常清楚：

第一步：本地把 Hugo 跑起来

Hugo 是 Go 写的静态站点生成器，速度快到离谱（几百篇文章也是毫秒级构建）。Windows 用 winget 装：

winget install Hugo.Hugo.Extended

一定要装 Extended 版本，很多主题用到 SCSS，普通版本编译会报错。

建站：

hugo new site my-blog
cd my-blog

接着挑一个主题。Hugo 主题多到挑花眼，去 Hugo Themes 按标签筛（个人博客常用 blog、personal），或者直接 GitHub 搜 hugo-theme，看预览图顺眼、星标多、最近还在维护的就行。

选好后把主题仓库 clone 进 themes/ 目录，目录名随便起，记住它就行：

git clone <主题仓库地址> themes/my-theme

主题这东西萝卜青菜，别人的不一定适合你。挑一个自己能看懂模板结构的，后期改起来才不痛苦。

然后在站点配置 hugo.toml 里把主题指过去：

1
2
3
4
5
6
7
8

theme = "my-theme"                      # 跟 themes/ 下的目录名保持一致
baseURL = "https://blog.xxxx.online/"   # 换成你自己的域名

[params]
    [params.comments]
        enable = true        # 开启评论
    [params.footer]
        visitor = true       # 页脚显示访问量

不同主题的 [params] 配置项完全不一样，具体看主题自己的文档，别照抄。

本地预览：

hugo server -D

浏览器打开 http://localhost:1313/，写文章就是往 content/posts/ 里丢 Markdown 文件。

第二步：推到 Gitee

为什么用 Gitee 而不是 GitHub？因为国内平台之间互相访问快，后面 EdgeOne 拉代码、构建都不用翻墙。

先配置全局身份（没配过的话 git 会拒绝提交）：

git config --global user.name "your-name"
git config --global user.email "your-email@example.com"

在 Gitee 上新建一个仓库，然后：

git init
git remote add origin https://gitee.com/your-name/blog.git
git add -A
git commit -m "init: 博客初始化"
git push -u origin master

第三步：EdgeOne Pages 接管构建

这一步是整个方案的核心，也是「白嫖」的来源。

1. 打开腾讯云 EdgeOne Pages 控制台
2. 创建项目 → 选择从 Git 仓库导入 → 授权并选中刚才的 Gitee 仓库
3. 框架预设选 Hugo，它会自动帮你填好：
   • 构建命令：hugo --gc --minify
   • 输出目录：public

也可以在仓库根目录放一个 edgeone.json 把配置固化下来（建议，这样换电脑重克隆也不怕）：

1
2
3
4
5

{
  "hugoVersion": "0.167.0",
  "buildCommand": "hugo --gc --minify",
  "outputDirectory": "public"
}

保存之后它会跑第一次构建，大约 40～80 秒。完成后给你一个 xxx.edgeone.app 的临时域名，能打开就说明通了。

从此以后：push 即上线。每次 git push 到主分支，EdgeOne 自动拉代码、重新构建、灰度切换，全程无需手动操作。

第四步：买域名并绑定

想用自己的域名，去腾讯云或者阿里云的域名页搜一个喜欢的：

• 常见后缀（.com / .cn）最贵也就几十块一年，.online / .top / .xyz 这类新后缀常年促销，首年几块钱
• 必须先做域名实名认证，否则解析不生效
• 走国内加速节点时，控制台会提示需要 ICP 备案，个人备案线上就能提交，一般一周左右下号（不备案也能用，只是只能走平台分配的默认域名或境外节点）

买完之后在 EdgeOne 项目里：

1. 项目设置 → 域名管理 → 添加自定义域名（比如 blog.xxxx.online）
2. 控制台会给你一条 CNAME 记录值
3. 回到域名解析控制台，添加一条 CNAME：主机记录 blog，记录值填刚才那串
4. 证书是平台自动签发自动续期的，什么都不用做

等解析生效（几分钟到几小时不等），你的博客就有自己的名字了。

第五步：评论 + 访问统计（这才是含金量）

静态博客最大的短板就是「没有后端」：不能存评论、不能记访问量。第三方方案要么收费、要么要在页面上挂别人的 logo、要么在国内加载不出来。

EdgeOne 的边缘函数可以直接解决这个问题 —— 在仓库根目录建一个 edge-functions/ 文件夹，里面的文件路径就是接口路径：

edge-functions/
└── api/
    ├── stats/index.js     → https://你的域名/api/stats
    └── comment/index.js   → https://你的域名/api/comment

数据存哪？用 EdgeOne Blob。它是平台自带的对象存储，免费 1GB，最爽的一点是：

代码里第一次调用 getStore('blog-data') 时，命名空间自动创建，不需要去控制台申请、不需要审核、不需要绑定变量。

核心代码就这么几行：

1
2
3
4
5
6
7
8

import { getStore } from '@edgeone/pages-blob';

const store = getStore('blog-data');

// 写
await store.set('stats/pv/total', '1024');
// 读（计数器必须读最新值，用强一致模式）
const pv = await store.get('stats/pv/total', { consistency: 'strong' });

实现出来的效果：

• 页脚显示 总浏览 / 总访客 / 今日访客，访客用浏览器本地 ID 去重，同一个人刷一百遍也只算一次
• 每篇文章标题下显示本篇阅读量
• 评论区支持昵称、头像（根据昵称自动生成颜色）、网址、回复时间，按 IP 限流防刷
• 管理员凭 ADMIN_TOKEN（在控制台「项目设置 → 环境变量」里配置）可以删除任意评论

完整代码我放在博客仓库里，思路是「一条评论存成一个 JSON 对象」，天然避免并发写入互相覆盖。

踩坑记录（这部分最值钱）

都是真实掉进去过的坑，省得你再爬一遍。

1. 中文文件名线上 404

本地 hugo server 好好的，一上线所有中文路径的文章全 404。原因是 EdgeOne 无法把浏览器发来的百分号编码 URL（%E6%90%AD%E5%BB%BA...）匹配到中文目录的构建产物。

解法：每篇文章的 front matter 里都加一个英文 slug，URL 就变成纯英文：

1
2
3
4

+++
title = "我的第一篇博客"
slug = "my-first-post"     # URL 变成 /posts/blog/my-first-post/
+++

2. 夜间模式按钮没反应

主题的 JS 里用 link[href$='css/my-theme.css'] 这种方式找样式表，但 Hugo 开了 relativeURLs = true 之后 CSS 路径变成了相对路径 ../../css/my-theme.css，$=（以……结尾）的选择器永远匹配不到。

解法：把 $= 改成 *=（包含匹配）。这个坑跟主题无关，任何主题只要开了 relativeURLs 又用后缀匹配去选资源，都会中招。

3. 标签页、分类页排版乱了

Hugo 渲染 /tags/xxx/ 这种页面时找的是 term.html 模板，主题里没有就回退到最原始的列表模板，排版直接裸奔。

解法：在 themes/你的主题/layouts/_default/ 下补一个 term.html。

另外注意：新增模板文件后必须重启 hugo server，模板查找表在运行中不会刷新。

4. 环境变量改了没生效

在控制台加了环境变量，函数里读不到。官方文档一句话点破：环境变量只对之后的新部署生效。

解法：改完环境变量，去控制台手动点一次「重新部署」。

5. 列表页缩略图乱抓图

文章里没配封面图时，主题会自动抓正文第一张图当缩略图，结果列表页出现一堆代码截图、表情包，非常难看。

解法：把回退逻辑去掉，改成 front matter 指定 image → 无图就用主题默认图。

费用与额度一览

写在最后

这套东西折腾下来最直观的感受是：现在搭个人博客的门槛，已经不是钱，而是愿不愿意花一个下午。

服务器不用买、证书不用管、后端不用写、运维不存在 —— 你只需要专心写 Markdown，然后 git push。

如果你也想拥有一个自己的角落，照着上面五步走就行。有问题欢迎在评论区留言，这个评论区就是我刚搭的这套系统在撑着。

本文首发于我的博客，转载请注明出处。