深入解析 Cloudflare Pages 域名解析功能

🌐 Cloudflare Pages 域名解析功能完全指南

在成功将博客部署到 Cloudflare Pages 后，绑定自己的域名是让网站显得专业的关键一步。本文将深入浅出地解释 Cloudflare Pages 的域名解析功能，帮助你透彻理解其工作原理并顺利完成配置。

📌 什么是域名解析？为什么需要它？

域名解析（DNS Resolution）是将人类易记的域名（如 blog.example.com）转换为计算机可识别的 IP 地址的过程。对于 Cloudflare Pages 而言，域名解析意味着：

  • 将你的自定义域名指向 Cloudflare 的边缘网络。
  • 让用户通过你的专属域名访问 Pages 上托管的网站。
  • 利用 Cloudflare 的全球 CDN 加速访问速度，并享受自动 SSL 加密。

简单来说，没有正确的域名解析，你的域名就无法打开你的网站内容。

🔧 Cloudflare Pages 支持两种 DNS 配置方式

根据你的域名当前 DNS 托管位置，Cloudflare Pages 提供了两种接入方式。

方式一：使用 Cloudflare DNS（完全托管）

  • 适用场景：你的域名注册商支持修改 NS 记录，且你希望将所有 DNS 管理交给 Cloudflare。
  • 操作流程：
    1. 在 Cloudflare 仪表盘添加你的域名，并按照提示将域名的 NS 记录修改为 Cloudflare 提供的地址。
    2. 等待 NS 生效后，在 Cloudflare Pages 项目的“自定义域”中添加你的域名（例如 blog.example.com）。
    3. Cloudflare 会自动为你创建所需的 DNS 记录（如 CNAME 或 A 记录），无需手动操作。
  • 优点：
    • 全自动管理，减少出错。
    • 享受 Cloudflare 全套安全功能（如 DDoS 防护、WAF）。
    • 可在 Cloudflare 控制台统一管理所有子域名的解析。

方式二：使用外部 DNS 提供商（保持现有 DNS）

  • 适用场景：你的域名注册商不支持修改 NS，或者你希望继续使用当前的 DNS 管理服务。
  • 操作流程：
    1. 在 Cloudflare Pages 项目中添加自定义域名。
    2. Cloudflare 会提供一条 CNAME 记录 的目标值（例如 你的项目名.pages.dev）。
    3. 登录你的域名注册商（或 DNS 管理面板），手动添加一条 CNAME 记录：
      • 主机记录：填写子域名前缀（如 blog，若为裸域名则留空或填写 @，见下文说明）。
      • 记录值：填写 Cloudflare 提供的 项目名.pages.dev 地址。
    4. 保存后等待 DNS 生效。
  • 注意事项：如果你要添加的是 裸域名（根域名，如 example.com），请务必阅读下一节的“CNAME 展平”说明。

🧩 关键概念：CNAME 展平（CNAME Flattening）

问题背景

在 DNS 标准中，裸域名（zone apex，即 example.com 形式）不能直接设置 CNAME 记录，因为裸域名通常需要同时存在其他类型的记录（如 MX 邮件记录、SOA 记录等），而 CNAME 记录与这些记录冲突。

Cloudflare 的解决方案

Cloudflare 通过 CNAME 展平 技术巧妙地解决了这个问题：

  • 当你为裸域名添加 CNAME 记录时，Cloudflare 的 DNS 服务器不会返回 CNAME 响应，而是主动解析该 CNAME 目标（即 pages.dev 的 IP 地址），并直接返回 A 记录（IPv4）和 AAAA 记录（IPv6）。
  • 这样既满足了裸域名必须指向 IP 的协议要求，又能让你的裸域名成功指向 Cloudflare Pages 项目。

对用户的影响

  • 你无需进行任何额外操作，Cloudflare 会自动处理。
  • 这意味着你可以轻松地将 example.com 直接绑定到你的 Pages 项目，而不必强制使用 www.example.com 这类子域名。

🔒 自动 SSL 证书：让网站更安全

绑定域名后，Cloudflare Pages 会通过 Let’s Encrypt 或 Cloudflare 自家的 CA，为你的域名自动申请并部署免费的 SSL/TLS 证书。

  • 颁发时间：通常只需几分钟，证书状态可在 Pages 项目的“自定义域”页面查看。
  • 证书类型：支持单域名证书和泛域名证书（如 *.example.com）。
  • 自动续期：证书到期前系统会自动续期，无需人工干预。
  • 验证方法：在浏览器访问你的域名，查看地址栏是否出现小锁图标，且证书信息显示有效。

✅ 验证与故障排查

如何确认域名解析成功？

  • 在 Cloudflare Pages 项目的“自定义域”列表中，查看域名状态是否为 “Active”（活跃）。
  • 使用 ping 命令检查域名是否解析为 Cloudflare 的 IP 地址（通常是 104.16.x.x 或 104.17.x.x 等）。
  • 直接在浏览器访问 https://你的域名，确认能否正常显示你的网站。

常见问题及解决方法

问题现象 可能原因 解决步骤
域名状态长时间显示 “Pending” DNS 记录未正确添加或未生效 检查 CNAME 记录是否填写正确，等待 5~30 分钟再刷新；可尝试清除本地 DNS 缓存（ipconfig /flushdns）
访问时显示 Cloudflare 404 页面 Pages 项目未部署或构建失败 检查 GitHub 仓库源码是否完整，查看 Cloudflare Pages 的部署日志
访问时出现 400 Bad Request 使用了 HTTP 访问而服务端仅支持 HTTPS 将 http:// 改为 https://，或在 Cloudflare 开启“始终使用 HTTPS”
SSL 证书状态显示 “错误” 证书颁发失败 确认域名解析正确，等待一段时间自动重试；若仍失败，可尝试重新绑定域名
裸域名（example.com）无法访问 外部 DNS 提供商不支持 CNAME 展平 建议将 DNS 迁移到 Cloudflare，或改用 www 子域名

📝 实操示例：将 blog.naranja33.top 绑定到我的项目

以下是我成功配置的完整步骤，供参考：

  1. 拥有一个域名（我使用了付费域名 naranja33.top，通过 NameSilo 获取）。
  2. 在 Cloudflare Pages 项目中添加自定义域：
    • 进入 Pages 项目 → 设置 → 自定义域 → 设置自定义域。
    • 输入 blog.naranja33.top。
  3. 选择 DNS 配置方式：
    • Cloudflare 给出提示，要求添加 CNAME 记录。
  4. 在 DNS 管理面板添加 CNAME：
    • 登录 DNSHE 控制台，添加记录：
      • 主机名：blog
      • 目标：my-studio-hexo.pages.dev（替换为你的项目名）
  5. 等待生效（约 5 分钟后），Cloudflare 显示状态变为 Active。
  6. 访问 https://blog.naranja33.top，成功显示博客页面，且地址栏有小锁图标。

🎯 总结

Cloudflare Pages 的域名解析功能将繁琐的 DNS 配置自动化，通过两种灵活的方式（托管 DNS 或外部 DNS）让你轻松绑定自定义域名。其 CNAME 展平技术解决了裸域名无法使用 CNAME 的长期痛点，而自动 SSL 证书则保障了网站的安全传输。

无论你是技术新手还是资深运维，都能在几分钟内完成域名绑定，让博客或网站拥有专属标识。如果遇到问题，利用上述排查方法，绝大多数情况都能快速解决。

我的博客地址：https://blog.naranja33.top
欢迎留言交流，或通过 GitHub 联系我。