在 Cloudflare Pages 中实现 CNAME 接入（即自定义域名绑定）通常涉及两个主要步骤：配置 Cloudflare Pages 项目 和 在域名注册商处设置 DNS 记录。
以下是详细的操作指南：
✅ 前提条件
- 你已拥有一个 Cloudflare 账户，并将你的域名托管在 Cloudflare 上（推荐方式，功能最全）。
- 你的 Pages 项目已创建并部署成功。
- 你拥有一个已注册的域名。
📌 方法一：通过 Cloudflare Dashboard 添加自定义域名（推荐）
第一步：在 Cloudflare Pages 中添加自定义域名
- 登录 Cloudflare Dashboard。
- 进入 Pages → 选择你的项目。
- 点击 Custom domains（自定义域名）标签页。
- 点击 Set up a custom domain（设置自定义域名）。
- 输入你的域名（
www.example.com或example.com）。 - 点击 Continue（继续）。
- Cloudflare 会自动检测 DNS 记录，如果检测到，它会提示你确认；如果没有，它会提供你需要添加的 DNS 记录。
💡 如果域名托管在 Cloudflare 上，系统会自动添加所需的 DNS 记录,无需手动操作。
第二步：配置 DNS 记录（如果域名不在 Cloudflare 托管）
如果你的域名没有托管在 Cloudflare 上，你需要手动在域名注册商或 DNS 服务商处添加以下记录：
添加 CNAME 记录（适用于子域名，如 www）
| 类型 | 名称 | TTL | |
|---|---|---|---|
| CNAME | www |
<your-project>.pages.dev |
Auto |
如果你的 Pages 项目是
my-app.pages.dev，则 CNAME 指向my-app.pages.dev。
添加 ALIAS 或 ANAME 记录（适用于根域名，如 example.com）
根域名不能直接使用 CNAME，需使用 ALIAS 或 ANAME 记录（取决于你的 DNS 提供商）：
| 类型 | 名称 | TTL |
|---|---|---|
| ALIAS | <your-project>.pages.dev |
Auto |
注意：并非所有 DNS 提供商都支持 ALIAS/ANAME，如果不行，可以考虑使用
www子域名，并通过重定向将根域名指向www。
第三步：验证并启用 SSL
- 返回 Cloudflare Pages 的 Custom domains
页面。
- 点击 Verify（验证）按钮。
- 验证通过后，Cloudflare 会自动为自定义域名签发 SSL 证书。
- 确保 SSL/TLS 模式设置为 Full 或 Full (strict)。
📌 方法二：使用 Cloudflare Pages Functions 处理自定义域名逻辑（高级）
如果你需要在 CNAME 接入后，根据域名动态返回不同内容（例如多租户应用），可以使用 Pages Functions 来实现。
示例：根据域名返回不同内容
- 在项目中创建
functions/_middleware.ts（或.js）：
export async function onRequest(context) {
const { request, next } = context;
const hostname = new URL(request.url).hostname;
// 根据域名返回不同内容
if (hostname === 'app1.example.com') {
return new Response('Welcome to App 1', {
headers: { 'Content-Type': 'text/plain' },
});
} else if (hostname === 'app2.example.com') {
return new Response('Welcome to App 2', {
headers: { 'Content-Type': 'text/plain' },
});
}
// 默认行为
return next();
}
部署项目,确保自定义域名已正确配置。
📌 常见问题
❓ 为什么我的自定义域名无法解析？
- 检查 DNS 记录是否正确（CNAME 指向
.pages.dev域名）。 - 等待 DNS 传播（可能需要几分钟到几小时）。
- 确保域名已正确添加到 Cloudflare 账户中。
❓ 为什么 SSL 证书未生效？
- 确保 DNS 记录已正确验证。
- 检查 SSL/TLS 模式是否设置为 Full 或 Full (strict)。
- 等待 Cloudflare 自动签发证书（通常几分钟内完成）。
❓ 根域名（example.com）无法使用 CNAME？
- 根域名不支持 CNAME 记录，请使用 ALIAS、ANAME 或 CNAME Flattening（Cloudflare 支持）。
- 或者，使用
www子域名，并通过重定向将根域名指向www。
| 步骤 | 操作 |
|---|---|
| 1 | 在 Cloudflare Pages 中添加自定义域名 |
| 2 | 配置 DNS 记录（CNAME 或 ALIAS） |
| 3 | 验证域名并启用 SSL |
| 4 | （可选）使用 Pages Functions 处理动态逻辑 |
通过以上步骤，你可以成功将自定义域名接入 Cloudflare Pages，并通过 CNAME 或 ALIAS 记录实现访问。
首发原创文章，作者：王坚，如若转载，请注明出处：https://idctop.com/%e5%a6%82%e4%bd%95%e7%94%a8cloudflare-pages-function%e5%ae%9e%e7%8e%b0cname%e6%8e%a5%e5%85%a5%ef%bc%9fcname%e6%8e%a5%e5%85%a5%e9%85%8d%e7%bd%ae%e6%95%99%e7%a8%8b/
