如何设置 SendGrid 联系表单邮件服务

Last updated: April 10, 2026

为什么需要 SendGrid？

当有人填写你的联系表单时，网站需要一种方式来发送邮件 — 一封发给你（通知邮件），一封发给客户（确认邮件）。SendGrid 是一个可靠的邮件发送服务，专门处理这类需求。

免费套餐：每天 100 封邮件，对于大多数小型企业的联系表单来说完全够用。

只有在 SiteKit 中选择了联系表单功能时才需要设置。 如果你的网站没有联系表单，可以跳过本指南。

第 1 步：创建 SendGrid 账号

前往 sendgrid.com，点击 Start for Free
填写你的信息并创建账号
验证你的邮箱地址

第 2 步：验证你的发件域名

这是最重要的一步。如果不进行域名验证，你的邮件会被归入垃圾邮件。

在 SendGrid 中，进入 Settings > Sender Authentication
点击 Authenticate Your Domain
选择你的 DNS 服务商。如果你的域名在 Cloudflare 上，选择 Cloudflare
输入你的域名（例如 yourbusiness.com）
SendGrid 会提供 3 条 CNAME 记录供你添加

添加 DNS 记录

前往 Cloudflare 控制台 > 你的域名 > DNS：

添加 SendGrid 提供的 3 条 CNAME 记录
同时添加以下 TXT 记录：

SPF 记录：

Type：TXT
Name：@
Value：v=spf1 include:sendgrid.net ~all

DMARC 记录：

Type：TXT
Name：_dmarc
Value：v=DMARC1; p=none; rua=mailto:your-email@yourdomain.com

为什么需要这么多 DNS 记录？ SPF 告诉邮件服务器 SendGrid 有权代表你的域名发送邮件。DKIM（即那些 CNAME 记录）添加了数字签名。DMARC 将两者关联起来。如果缺少这些记录，邮件会被标记为垃圾邮件或直接被拒收。

回到 SendGrid 点击 Verify。DNS 变更通常需要几分钟才能生效。

第 3 步：生成 API 密钥

在 SendGrid 中，进入 Settings > API Keys
点击 Create API Key
为它起个名字（例如”Contact Form”）
选择 Full Access（或至少选择 Mail Send 权限）
点击 Create & View
立即复制 API 密钥 — 之后你将无法再次查看

第 4 步：添加环境变量

在你的 Cloudflare Pages 控制台中：

进入你的 Pages 项目 > Settings > Environment variables
在 Production 环境中添加以下变量：

变量名	值	示例
`SENDGRID_API_KEY`	第 3 步获取的 API 密钥	`SG.xxxxx...`
`CONTACT_EMAIL`	你希望接收表单提交的邮箱	`info@yourbusiness.com`
`FROM_EMAIL`	邮件的”发件人”地址	`noreply@yourbusiness.com`

点击 Save
触发一次新部署（推送一个提交或在 Cloudflare 中点击 Retry deployment）

第 5 步：测试联系表单

访问你的线上网站
用你自己的邮箱填写联系表单
提交表单
检查你的收件箱：
- 企业通知邮件 — 应该发送到你的 CONTACT_EMAIL
- 客户确认邮件 — 应该发送到你在表单中填写的邮箱

也检查一下垃圾邮件文件夹。 如果邮件进了垃圾邮件，可能是你的 DNS 记录尚未完全生效。等待一小时后再试。

常见问题排查

邮件完全没有收到

仔细检查 Cloudflare 中的 SENDGRID_API_KEY 环境变量
确保 SendGrid 中的域名验证状态显示为已验证
在 Cloudflare Pages 控制台中查看函数日志是否有错误（在项目下的 Functions 中查看）

邮件进入垃圾邮件

确认所有 DNS 记录都已配置（SPF、DKIM、DMARC）
使用已验证域名下的真实”发件人”地址（不要用 gmail.com 地址）
DNS 变更最多可能需要 48 小时才能完全生效

表单在本地可以使用但在生产环境中不行

环境变量可能未设置。检查 Cloudflare Pages > Settings > Environment variables
CORS 可能拦截了请求。检查 functions/api/contact.js 中允许的来源是否包含你的域名