設定 Resend
為 Saavo 設定 Resend、寄件網域和 API Key,讓正式環境能寄送註冊驗證、密碼重設等系統郵件。
Saavo 預設使用 Resend 寄送註冊驗證、密碼重設和帳號安全提醒等系統郵件。本機開發時,郵件內容只會顯示在終端機,部署到 Cloudflare 後,專案才會呼叫 Resend 實際寄信。
開始前需要準備:
- 一個已交由 Cloudflare DNS 管理的網域。
- 一個可以長期使用的 Resend 帳號。
- 一個能接收使用者回覆的客服信箱。
如果網域尚未加入 Cloudflare,請先完成網域設定。網站是否已綁定 Custom Domain,不影響 Resend 驗證,只要目前的網域確實由 Cloudflare 管理即可。
先決定兩個電子郵件地址
本文繼續使用 webpagetopdf.dev 作為範例,分別設定寄信與收信:
| 地址 | 用途 | 是否需要實際信箱 |
|---|---|---|
send@mail.webpagetopdf.dev | 系統郵件顯示的寄件者地址 | 不需要另外建立信箱 |
support@webpagetopdf.dev | 接收使用者回覆,也是網站的客服信箱 | 必須能正常收信 |
Resend 驗證的是 mail.webpagetopdf.dev 這個子網域。驗證通過後,就能使用 send@mail.webpagetopdf.dev、account@mail.webpagetopdf.dev 等地址寄信,不需要預先建立這些信箱。
客服信箱則不同。Saavo 會將 supportEmail 寫入郵件的 Reply-To,使用者按下「回覆」後,郵件會寄到這個地址,因此它必須能夠收信。你可以使用 Cloudflare Email Routing,將 support@webpagetopdf.dev 轉寄到平常使用的信箱。
寄信與收信可以使用不同服務
mail.webpagetopdf.dev 交給 Resend 寄送系統郵件,support@webpagetopdf.dev 則透過 Cloudflare Email Routing 接收使用者回覆。兩者使用不同名稱,不會互相覆寫,也不需要在根網域重複加入兩組 MX 記錄。
註冊 Resend
建立帳號
開啟 Resend 註冊頁面。可以使用 Google、GitHub,也可以使用電子郵件地址和密碼註冊。選擇能長期管理的登入方式,並依頁面提示完成電子郵件驗證。

團隊專案不要讓多人共用同一個帳號。註冊後,應在 Resend 邀請成員加入同一個 Team,日後才能個別撤銷權限。
進入管理介面
登入後會進入 Send your first email 頁面。左側的 Domains 用來驗證寄件網域,API keys 則用來建立專案需要的金鑰。

首頁提供的測試地址適合用來確認帳號能呼叫 API,但無法取代正式網域驗證。Saavo 要寄信給實際使用者,仍需完成後續設定。
驗證寄件網域
填寫子網域
在 Name 填入:
mail.webpagetopdf.dev
這裡填的是網域,不是電子郵件地址。不要寫成 send@mail.webpagetopdf.dev,也不要加上 https:// 或路徑。
如果沒有明確的區域或法規遵循需求,可以保留 Advanced options 的預設設定。Resend 會依目前設定產生對應的 DNS 記錄,後續請以頁面實際顯示的內容為準,不要照抄教學截圖中的值。
確認網域後,按下 Add domain。
選擇自動設定 DNS
新增網域後,Resend 會進入 DNS Records。本文的網域由 Cloudflare 管理,因此按下 Auto configure。

如果沒有自動設定入口,或不想授權 Resend 寫入 DNS,可以選擇 Manual setup,依頁面列出的類型、名稱和值,到 Cloudflare 的 DNS → Records 逐筆新增。
授權寫入 DNS 記錄
Cloudflare 會列出 Resend 準備新增的記錄。確認頁面中的網域為 mail.webpagetopdf.dev,並核對記錄都是 DNS only,再按下 Authorize。

這是一次性授權,只允許寫入目前頁面列出的記錄,不代表 Resend 日後能任意修改整個網域。截圖中的記錄內容已模糊處理,實際設定時必須使用自己頁面產生的值。
等待 Resend 檢查
授權後會回到網域詳細資訊頁面。狀態為 Pending、進度停在 Checking DNS 時,代表記錄已提交,Resend 正在等待 DNS 生效。

這時不要反覆刪除網域或重新授權。可以先到 Cloudflare 的 DNS → Records 確認記錄已出現,再等待 Resend 繼續檢查。
確認驗證成功
回到 Domains,看到 mail.webpagetopdf.dev 的狀態改成 Verified,就代表目前的 Resend 帳號已能使用這個子網域寄信。

網域驗證成功,不代表 Saavo 已設定完成。接下來還需要建立 API Key,並將寄件者地址和金鑰寫入專案。
需要手動新增 DNS 時
選擇 Manual setup 後,同時開啟 Resend 的網域詳細資訊和 Cloudflare 的 DNS → Records,依 Resend 提供的清單,逐筆新增 MX、TXT 或 CNAME 記錄:
- 類型、名稱、內容和優先順序必須與 Resend 頁面一致。
- TTL 保留 Auto 即可。
- 支援代理的記錄保持 DNS only。
- Cloudflare 的 Name 通常填入相對於根網域的部分,請以輸入框最後顯示的完整網域為準。
- 如果 DNS 已有同名記錄,請先確認屬於哪項服務,不要直接刪除,也不要自行合併兩筆 SPF 內容。
全部儲存後,回到 Resend 重新驗證。
留意重複補上的網域
Cloudflare 會在部分輸入框後自動補上根網域。儲存前請檢查最終名稱,避免將 mail.webpagetopdf.dev 寫成 mail.webpagetopdf.dev.webpagetopdf.dev。自動設定流程通常不會有這個問題。
建立 API Key
限制金鑰權限
填入容易辨識用途的名稱,例如 email sender 或 webpagetopdf-production。Permission 選擇 Sending access,Domain 選擇剛才驗證的 mail.webpagetopdf.dev,再按下 Add。

Saavo 寄信不需要 Full access。將金鑰限制在指定網域後,即使日後同一個 Resend 帳號加入其他網域,這個專案也無法用那些網域寄信。
立即儲存金鑰
建立後,Resend 會顯示完整 API Key。按下複製按鈕,存入密碼管理工具,或稍後要填寫的 .env.production。

完整金鑰只顯示一次。確認已儲存後再按下 Done,不要將它放入瀏覽器端程式碼、截圖、聊天記錄或 Git 儲存庫。
金鑰外洩後應立即撤銷
如果 API Key 曾出現在公開儲存庫、截圖或聊天記錄中,應立即回到 Resend 撤銷並重新建立。只從檔案中刪除,無法阻止已取得金鑰的人繼續使用。
設定 Saavo
先確認專案選用的郵件服務是 Resend。預設範本已採用以下設定:
emailProvider: {
type: 'resend',
},寄件者名稱、寄件者地址和客服信箱位於 config/base.ts:
fromEmailAddress: {
name: 'Webpage to PDF',
email: 'send@mail.webpagetopdf.dev',
},
supportEmail: 'support@webpagetopdf.dev',fromEmailAddress.email 必須屬於剛才驗證的確切網域。驗證的是 mail.webpagetopdf.dev,就不能將寄件者寫成 send@webpagetopdf.dev。
尚未首次部署
執行:
npm run deploy:init部署過程會依序詢問:
Email sender address
Support email address
Resend API key分別填入:
send@mail.webpagetopdf.dev
support@webpagetopdf.dev
剛建立的 Resend API Key部署指令碼會將兩個電子郵件地址更新到 config/base.ts,並將 API Key 存入 .env.production。互動流程不會修改 fromEmailAddress.name,正式部署前仍需開啟 config/base.ts,確認已改成目前的產品名稱。
專案已經部署過
先修改 config/base.ts 中的寄件者名稱、寄件者地址和客服信箱,再將金鑰寫入 .env.production:
RESEND_API_KEY="你的 Resend API Key"接著執行:
npm run doctor
npm run deploy:update不要只在 Cloudflare Dashboard 手動新增 Secret。Saavo 後續部署仍以 .env.production 為準,只修改遠端環境,會讓本機記錄與實際部署狀態不一致。
本機開發不會實際寄信
npm run dev 會在終端機輸出 [DEV EMAIL PREVIEW],不會呼叫 Resend。本機 .env 的 RESEND_API_KEY 可以留白,正式環境金鑰只存入 .env.production。
實際寄出一封郵件
部署後,到正式環境完成一次完整驗證:
- 使用能收信的地址註冊帳號,或發起一次密碼重設。
- 檢查收件匣和垃圾郵件資料夾。
- 開啟 Resend 的 Emails,確認對應郵件已出現。
- 進入郵件詳細資訊,檢查寄送狀態。
- 確認郵件的 From 為
send@mail.webpagetopdf.dev,Reply-To 為support@webpagetopdf.dev。 - 直接回覆測試郵件,確認客服信箱確實能收到。
網域顯示 Verified,只代表 Resend 接受這個寄件網域,不能證明專案設定、正式環境金鑰和客服信箱都正確。以上流程全部通過後,才算完成郵件設定。

