使用 SendGrid Email 設定電子郵件驗證

Logto 的官方 SendGrid 電子郵件服務連接器。

提示:

本指南假設你已對 Logto 連接器 (Connectors) 有基本了解。若不熟悉，請參閱 連接器 (Connectors) 指南以開始使用。

開始使用

SendGrid（即 Twilio SendGrid）是一個用於交易和行銷電子郵件的客戶通信平台。我們可以使用其電子郵件發送功能來發送 驗證碼。

註冊 SendGrid 帳戶

在 SendGrid 網站創建一個新帳戶。如果你已經有帳戶，可以跳過此步驟。

驗證發件人

前往 SendGrid 控制台頁面並使用你的 SendGrid 帳戶登入。

發件人表示我們的驗證碼電子郵件將從哪些地址發送。為了通過 SendGrid 郵件伺服器發送電子郵件，你需要至少驗證一個發件人。

從 SendGrid 控制台頁面開始，從側邊欄進入 "Settings" -> "Sender Authentication"。

建議進行域驗證，但不是必須的。你可以點擊 "Authenticate Your Domain" 卡片中的 "Get started"，並按照接下來的指南將發件人連結並驗證到 SendGrid。

通過點擊面板中的 "Verify a Single Sender" 按鈕，你將看到一個需要一些關鍵資訊的表單來創建發件人。按照指南填寫所有這些欄位，然後點擊 "Create" 按鈕。

單一發件人創建後，應該會有一封帶有驗證連結的電子郵件發送到你的發件人電子郵件地址。前往你的郵箱，找到驗證郵件，並通過點擊電子郵件中的連結完成單一發件人的驗證。你現在可以使用剛剛驗證的發件人通過 SendGrid 連接器發送電子郵件。

創建 API 金鑰

從 SendGrid 控制台頁面開始，從側邊欄進入 "Settings" -> "API Keys"。

在 API Keys 頁面的右上角點擊 "Create API Key"。輸入 API 金鑰的名稱，並根據你的使用情況自訂 "API Key Permission"。在使用此 API 金鑰發送電子郵件之前，需要全域 Full Access 或 Restricted Access 並具有 Mail Send 的完整存取權限。

完成 Create API Key 流程後，API 金鑰將顯示在螢幕上。你應該將此 API 金鑰保存在安全的地方，因為這是你唯一能看到它的機會。

配置你的連接器

在 "Create API keys" 部分創建的 API 金鑰填入 apiKey 欄位。

在 fromEmail 和 fromName 欄位填入發件人的 From Address 和 Nickname。你可以在 "Sender Management" 頁面找到發件人的詳細資訊。fromName 是可選的，因此你可以跳過填寫。

你可以為不同的情況添加多個 SendGrid 郵件連接器模板。以下是一個添加單一模板的範例：

• 填寫 subject 欄位，作為電子郵件的標題。
• 用任意字串類型的內容填寫 content 欄位。不要忘記保留 {{code}} 佔位符以放置隨機驗證碼。
• 根據不同的使用情況填寫 usageType 欄位，選擇 Register、SignIn、ForgotPassword 或 Generic。
• 根據不同的內容類型填寫 type 欄位，選擇 text/plain 或 text/html。

為了啟用完整的使用者流程，需要具有 Register、SignIn、ForgotPassword 和 Generic 的 usageType 的模板。

以下是 SendGrid 連接器模板 JSON 的範例。

[
  {
    "subject": "<register-template-subject>",
    "content": "<Logto: Your verification code is {{code}}. (register template)>",
    "usageType": "Register",
    "type": "text/plain",
  },
  {
    "subject": "<sign-in-template-subject>",
    "content": "<Logto: Your verification code is {{code}}. (sign-in template)>",
    "usageType": "SignIn",
    "type": "text/plain",
  },
  {
    "subject": "<forgot-password-template-subject>",
    "content": "<Logto: Your verification code is {{code}}. (forgot-password template)>",
    "usageType": "ForgotPassword",
    "type": "text/plain",
  },
  {
    "subject": "<generic-template-subject>",
    "content": "<Logto: Your verification code is {{code}}. (generic template)>",
    "usageType": "Generic",
    "type": "text/plain",
  },
]

測試 SendGrid 電子郵件連接器

你可以輸入一個電子郵件地址並點擊 "Send" 來查看設定是否能在 "Save and Done" 之前正常運作。

就是這樣。別忘了 在登入體驗中啟用連接器

配置類型

名稱	類型
apiKey	string
fromEmail	string
fromName	string (OPTIONAL)
templates	Template[]

模板屬性	類型	枚舉值
subject	string	N/A
content	string	N/A
usageType	enum string	'Register' | 'SignIn' | 'ForgotPassword' | 'Generic'
type	enum string	'text/plain' | 'text/html'