ตั้งค่าการยืนยันอีเมลด้วย SendGrid Email

ตัวเชื่อมต่อ Logto อย่างเป็นทางการสำหรับบริการอีเมล SendGrid

เคล็ดลับ:

คู่มือนี้สมมติว่าคุณมีความเข้าใจพื้นฐานเกี่ยวกับ ตัวเชื่อมต่อ (Connectors) ของ Logto หากคุณยังไม่คุ้นเคย โปรดดูคู่มือ ตัวเชื่อมต่อ (Connectors) เพื่อเริ่มต้น

เริ่มต้นใช้งาน

SendGrid (หรือ Twilio SendGrid) เป็นแพลตฟอร์มการสื่อสารกับลูกค้าสำหรับอีเมลธุรกรรมและอีเมลการตลาด เราสามารถใช้ฟังก์ชันส่งอีเมลของมันเพื่อส่ง รหัสยืนยัน

ลงทะเบียนบัญชี SendGrid

สร้างบัญชีใหม่ที่ เว็บไซต์ SendGrid คุณสามารถข้ามขั้นตอนนี้ได้หากมีบัญชีอยู่แล้ว

ยืนยันผู้ส่ง

ไปที่ หน้า SendGrid console และลงชื่อเข้าใช้ด้วยบัญชี SendGrid ของคุณ

ผู้ส่ง (Senders) หมายถึงที่อยู่อีเมลที่เราจะใช้ส่งอีเมลรหัสยืนยัน เพื่อส่งอีเมลผ่านเซิร์ฟเวอร์อีเมลของ SendGrid คุณต้องยืนยันผู้ส่งอย่างน้อยหนึ่งราย

เริ่มจาก หน้า SendGrid console ไปที่ "Settings" -> "Sender Authentication" จากแถบด้านข้าง

แนะนำให้ใช้ Domain Authentication แต่ไม่จำเป็นต้องทำเสมอไป คุณสามารถคลิก "Get started" ในการ์ด "Authenticate Your Domain" และทำตามคำแนะนำเพื่อเชื่อมโยงและยืนยันผู้ส่งกับ SendGrid

โดยการคลิกปุ่ม "Verify a Single Sender" ในแผงควบคุม คุณจะพบกับฟอร์มที่ต้องกรอกข้อมูลสำคัญเพื่อสร้างผู้ส่งใหม่ ให้ทำตามคำแนะนำ กรอกข้อมูลให้ครบถ้วน แล้วกดปุ่ม "Create"

หลังจากสร้าง single sender แล้ว จะมีอีเมลพร้อมลิงก์ยืนยันส่งไปยังอีเมลของผู้ส่งนั้น ให้ไปที่กล่องจดหมายของคุณ ค้นหาอีเมลยืนยัน และคลิกลิงก์ในอีเมลเพื่อยืนยัน single sender ตอนนี้คุณสามารถส่งอีเมลผ่านตัวเชื่อมต่อ SendGrid โดยใช้ผู้ส่งที่เพิ่งยืนยันได้แล้ว

สร้าง API keys

เริ่มจาก หน้า SendGrid console ไปที่ "Settings" -> "API Keys" จากแถบด้านข้าง

คลิก "Create API Key" ที่มุมขวาบนของหน้า API Keys ตั้งชื่อ API key และปรับแต่ง "API Key Permission" ตามกรณีการใช้งานของคุณ ต้องตั้งค่า Full Access หรือ Restricted Access ที่มีสิทธิ์เต็มสำหรับ Mail Send ก่อนจึงจะสามารถส่งอีเมลด้วย API key นี้ได้

API Key จะแสดงบนหน้าจอทันทีหลังจากคุณดำเนินการ Create API Key เสร็จสิ้น คุณควรบันทึก API Key นี้ไว้ในที่ปลอดภัย เพราะนี่เป็นโอกาสเดียวที่คุณจะเห็นมัน

กำหนดค่าตัวเชื่อมต่อของคุณ

กรอกฟิลด์ apiKey ด้วย API Key ที่สร้างในขั้นตอน "สร้าง API keys"

กรอกฟิลด์ fromEmail และ fromName ด้วย From Address และ Nickname ของผู้ส่ง คุณสามารถดูรายละเอียดของผู้ส่งได้ที่ "Sender Management" page fromName เป็นตัวเลือก (OPTIONAL) คุณสามารถข้ามได้

คุณสามารถเพิ่มเทมเพลตตัวเชื่อมต่ออีเมล SendGrid หลายรายการสำหรับกรณีต่าง ๆ ได้ นี่คือตัวอย่างการเพิ่มเทมเพลตเดียว:

• กรอกฟิลด์ subject ซึ่งจะเป็นหัวข้อของอีเมล
• กรอกฟิลด์ content ด้วยข้อความประเภท string ตามต้องการ อย่าลืมเว้นที่ว่างสำหรับ {{code}} ซึ่งเป็นรหัสยืนยันแบบสุ่ม
• กรอกฟิลด์ usageType ด้วยค่า Register, SignIn, ForgotPassword, Generic ตามกรณีการใช้งาน
• กรอกฟิลด์ type ด้วยค่า text/plain หรือ text/html ตามประเภทเนื้อหา

เพื่อเปิดใช้งาน user flows ได้ครบถ้วน จำเป็นต้องมีเทมเพลตที่มี usageType เป็น Register, SignIn, ForgotPassword และ Generic

นี่คือตัวอย่าง JSON ของเทมเพลตตัวเชื่อมต่อ SendGrid

[
  {
    "subject": "<register-template-subject>",
    "content": "<Logto: รหัสยืนยันของคุณคือ {{code}}. (register template)>",
    "usageType": "Register",
    "type": "text/plain",
  },
  {
    "subject": "<sign-in-template-subject>",
    "content": "<Logto: รหัสยืนยันของคุณคือ {{code}}. (sign-in template)>",
    "usageType": "SignIn",
    "type": "text/plain",
  },
  {
    "subject": "<forgot-password-template-subject>",
    "content": "<Logto: รหัสยืนยันของคุณคือ {{code}}. (forgot-password template)>",
    "usageType": "ForgotPassword",
    "type": "text/plain",
  },
  {
    "subject": "<generic-template-subject>",
    "content": "<Logto: รหัสยืนยันของคุณคือ {{code}}. (generic template)>",
    "usageType": "Generic",
    "type": "text/plain",
  },
]

ทดสอบตัวเชื่อมต่ออีเมล SendGrid

คุณสามารถกรอกที่อยู่อีเมลแล้วคลิก "Send" เพื่อตรวจสอบว่าการตั้งค่าสามารถใช้งานได้ก่อนคลิก "Save and Done"

เรียบร้อยแล้ว อย่าลืม เปิดใช้งานตัวเชื่อมต่อในประสบการณ์การลงชื่อเข้าใช้

ประเภทของการกำหนดค่า

ชื่อ	ประเภท
apiKey	string
fromEmail	string
fromName	string (OPTIONAL)
templates	Template[]

คุณสมบัติของ Template	ประเภท	ค่าที่เป็นไปได้
subject	string	N/A
content	string	N/A
usageType	enum string	'Register' / 'SignIn' / 'ForgotPassword' / 'Generic'
type	enum string	'text/plain' / 'text/html'