为 Hugo 博客配置 CDN 加速：从原理到实践

前言

在上一篇文章中，我们搭建了一个基于 Hugo + GitHub Actions 的自动化博客。虽然能正常访问，但存在一些问题：

服务器带宽有限，访问速度受限
源站 IP 直接暴露，容易成为攻击目标
没有缓存机制，每次都回源增加服务器负担
跨地域访问延迟高

本文记录了为博客配置阿里云 CDN 的完整过程，以及踩过的坑和解决方案。

为什么需要 CDN？

CDN 的工作原理

CDN (Content Delivery Network) 内容分发网络，简单来说就是在用户和源站之间加了一层代理缓存：

传统架构：
用户 → 源站服务器（单点，慢）

CDN 架构：
用户 → 就近的 CDN 节点 → 源站服务器
       ↑ 缓存静态资源

CDN 的核心优势

1. 性能提升

全国数百个节点，用户访问就近节点
静态资源缓存，减少回源请求
实测：页面加载速度提升 3-5 倍

2. 安全防护

隐藏源站真实 IP
自带 DDoS 防护
防止恶意扫描和攻击

3. 成本优化

减少源站带宽消耗
按量付费，个人博客成本极低（~5-10元/月）

4. 可用性保障

单节点故障自动切换
抗流量突发能力强

准备工作

前置条件

已部署的 Hugo 博客（可参考上一篇文章）
已备案的域名（国内 CDN 必须）
阿里云账号（或其他云服务商）

架构规划

最终架构：

用户浏览器 (HTTPS)
    ↓
CDN 节点 (全国分布)
    ↓ HTTP 回源
源站服务器 (隐藏)

关键设计：

CDN 对外提供 HTTPS（443端口）
回源使用 HTTP（80端口）
源站不对外暴露，只接受 CDN 回源

配置步骤

第一步：创建 CDN 加速域名

1.1 登录阿里云 CDN 控制台

访问阿里云 CDN 控制台

1.2 添加加速域名

点击"添加域名"，配置以下信息：

基础配置：

加速域名：blog.你的域名.com
业务类型：图片小文件（静态网站选这个）
源站信息：IP（填写你的服务器IP）
端口：80
加速区域：仅中国内地

业务类型选择说明：

图片小文件：网站、博客、小图片（推荐）
大文件下载：软件安装包、固件（> 20MB）
视音频点播：视频网站（不适合博客）

第二步：配置缓存策略

合理的缓存策略能大幅提升命中率和性能。

2.1 推荐的缓存规则

点击"缓存配置" → “添加”，按优先级配置：

规则 1：HTML 文件

类型：文件后缀
地址：html
过期时间：10 分钟
权重：90

原因： 博客内容更新频繁，10分钟缓存平衡性能与实时性

规则 2：CSS 和 JS

类型：文件后缀
地址：css,js
过期时间：7 天
权重：85

原因： 样式和脚本不常变，长缓存节省流量

规则 3：图片

类型：文件后缀
地址：jpg,jpeg,png,gif,webp,svg,ico
过期时间：30 天
权重：85

规则 4：字体

类型：文件后缀
地址：woff,woff2,ttf,eot
过期时间：365 天
权重：85

规则 5：默认兜底

类型：目录
地址：/
过期时间：1 小时
权重：99

权重说明： 数字越小优先级越高，匹配规则从高到低。

2.2 其他性能配置

开启压缩：

☑ 开启 Gzip 压缩

效果：文本文件压缩率 70-80%，显著提升加载速度

忽略 URL 参数：

☑ 忽略参数：是

效果：提高缓存命中率（page.html?v=1 和 page.html?v=2 使用同一份缓存）

第三步：配置 HTTPS 证书

3.1 证书来源选择

有两种方式：

方式 A：上传服务器证书（推荐）

如果你的服务器已经申请了 Let’s Encrypt 证书：

SSH 登录服务器
找到证书文件（通常在 /etc/letsencrypt/ 或站点 SSL 目录）
复制 fullchain.pem（证书）和 privkey.pem（私钥）
在 CDN 控制台选择"自定义上传"，粘贴内容

方式 B：使用云厂商免费证书

阿里云提供免费 DV 证书（单域名，1年有效期）：

证书来源：云盾 SSL 证书
证书类型：免费证书

3.2 强制 HTTPS

配置证书后，开启以下选项：

☑ 强制跳转 HTTPS（HTTP 自动 301 到 HTTPS）
☑ 开启 HTTP/2
☑ 开启 HSTS（可选，增强安全性）

第四步：安全配置

4.1 防盗链配置

防止其他网站盗用你的图片和资源。

Referer 白名单：

类型：白名单
白名单列表：
  - blog.你的域名.com
  - 你的域名.com
  - *.你的域名.com

☑ 允许空 Referer

说明：

白名单：只允许列表中的域名访问
允许空 Referer：用户可以直接在浏览器打开图片链接

4.2 用量封顶（重要！）

防止恶意刷流量导致天价账单。

流量封顶：

统计周期：自然日
流量阈值：10 GB/天

带宽封顶：

带宽阈值：10 Mbps

说明：

个人博客正常流量：1-2 GB/月
10 GB/天是安全缓冲值
超过阈值会自动下线域名（不产生费用）

第五步：修改 DNS 解析

5.1 获取 CNAME 地址

配置完成后，CDN 会分配一个 CNAME 地址：

blog.你的域名.com.w.kunlunaq.com

5.2 修改域名解析

登录域名 DNS 管理（如阿里云、腾讯云）：

删除旧的 A 记录：

主机记录：blog
记录类型：A
记录值：你的服务器IP

操作：删除 ❌

添加 CNAME 记录：

记录类型：CNAME
主机记录：blog
记录值：blog.你的域名.com.w.kunlunaq.com
TTL：10分钟

5.3 验证生效

等待 5-10 分钟，检查 DNS：

dig blog.你的域名.com

# 应该看到 CNAME 记录
blog.你的域名.com. 600 IN CNAME xxxx.w.kunlunaq.com.

常见问题与解决

问题 1：重定向循环（ERR_TOO_MANY_REDIRECTS）

现象：

访问网站时浏览器报错：
"该网页无法正常运作，将您重定向的次数过多"

原因分析：

这是最常见的问题！根本原因是：

1. CDN 用 HTTP 访问源站（回源协议）
2. 源站配置了强制 HTTPS 跳转
3. 源站返回 301 让 CDN 访问 HTTPS
4. CDN 再次用 HTTP 回源
5. 无限循环 ❌

解决方案：关闭源站的强制 HTTPS

CDN 已经对外提供 HTTPS 了，源站不需要再强制跳转。

Nginx 配置示例：

删除或注释掉这段：

# 删除这段配置
if ($scheme = http) {
    return 301 https://$host$request_uri;
}

1panel / 宝塔面板：

进入网站配置
关闭"强制 HTTPS"选项
或删除 SSL 监听（只保留 80 端口）

验证：

# 直接访问源站应该返回 200，不应该 301
curl -I http://你的服务器IP -H "Host: blog.你的域名.com"
# 应该看到：HTTP/1.1 200 OK

记得重载配置：

# Nginx
nginx -s reload

# Docker 容器
docker exec 容器名 nginx -s reload

问题 2：修改配置后内容没更新

原因： CDN 缓存了旧内容。

解决：

刷新 CDN 缓存
- 阿里云 CDN 控制台
- 进入"刷新预热"
- URL 刷新：https://blog.你的域名.com/
- 或目录刷新：https://blog.你的域名.com/
清除浏览器缓存
- Cmd/Ctrl + Shift + Delete
- 或使用无痕模式测试

问题 3：证书过期

Let’s Encrypt 证书有效期 90 天，需要定期更新。

解决：

服务器证书自动续期
- 1panel/宝塔：自动续期
- Certbot：配置 cron 定时任务
CDN 证书需手动更新
- 服务器续期后，导出新证书
- 在 CDN 控制台重新上传

建议： 设置日历提醒，证书到期前 1 周更新。

问题 4：CDN 费用突增

原因： 被恶意刷流量或爬虫抓取。

排查：

# 查看服务器访问日志
tail -f /var/log/nginx/access.log

# 或通过 CDN 控制台查看流量统计

预防：

✅ 配置用量封顶（10GB/天）
✅ 配置 Referer 白名单
✅ 配置 IP 访问限频（可选）

验证 CDN 是否生效

方法 1：检查响应头

打开浏览器开发者工具（F12） → Network 标签：

Via: cache12.l2cn3005[...]（CDN 标识）
X-Cache: HIT（命中缓存）/ MISS（未命中，回源）
Server: Tengine（阿里云 CDN）

方法 2：多地 Ping 测试

使用在线工具：

应该看到全国各地响应时间都很快且均衡。

方法 3：命令行测试

# 检查 DNS 解析
dig blog.你的域名.com

# 应该看到 CNAME 记录，不是 A 记录

# 检查 HTTPS
curl -I https://blog.你的域名.com

# 应该看到 CDN 相关的响应头

性能对比

实际测试数据（个人博客）：

指标	CDN 前	CDN 后	提升
首页加载时间	1.2s	0.3s	75%
HTML 大小	50KB	10KB	压缩 80%
图片加载	0.8s	0.2s	75%
TTFB	300ms	50ms	83%

成本分析

阿里云 CDN 计费

流量计费（默认）：

前 10TB：0.24 元/GB
示例：
  个人博客每月 5GB 流量
  成本：5 × 0.24 = 1.2 元/月

HTTPS 请求数：

前 1000 万次：免费
超出：0.05 元/万次
个人博客：基本在免费额度内

实际成本：5-10 元/月

总结

配置 CDN 后，博客的架构更加完善：

性能提升：

✅ 全国访问速度提升 3-5 倍
✅ 静态资源缓存，减少回源
✅ Gzip 压缩，节省 70-80% 流量

安全加固：

✅ 源站 IP 隐藏，防止直接攻击
✅ DDoS 防护，抗流量攻击
✅ 用量封顶，防止恶意刷量

成本优化：

✅ 减少服务器带宽消耗
✅ 按量付费，个人博客成本极低

最重要的经验：

关闭源站的强制 HTTPS，避免重定向循环
配置用量封顶，避免意外费用
合理设置缓存时间，平衡性能和实时性

现在，你的博客已经具备了生产级的性能和安全性，可以安心创作了！

前言#

为什么需要 CDN？#

CDN 的工作原理#

CDN 的核心优势#

准备工作#

前置条件#

架构规划#

配置步骤#

第一步：创建 CDN 加速域名#

1.1 登录阿里云 CDN 控制台#

1.2 添加加速域名#

第二步：配置缓存策略#

2.1 推荐的缓存规则#

2.2 其他性能配置#

第三步：配置 HTTPS 证书#

3.1 证书来源选择#

3.2 强制 HTTPS#

第四步：安全配置#

4.1 防盗链配置#

4.2 用量封顶（重要！）#

第五步：修改 DNS 解析#

5.1 获取 CNAME 地址#

5.2 修改域名解析#

5.3 验证生效#

常见问题与解决#

问题 1：重定向循环（ERR_TOO_MANY_REDIRECTS）#

问题 2：修改配置后内容没更新#

问题 3：证书过期#

问题 4：CDN 费用突增#

验证 CDN 是否生效#

方法 1：检查响应头#

方法 2：多地 Ping 测试#

方法 3：命令行测试#

性能对比#

成本分析#

阿里云 CDN 计费#

总结#

参考资源#

前言