SendGrid Email を使用してメール認証を設定する

SendGrid メールサービスのための公式 Logto コネクター。

ヒント:

このガイドは、Logto コネクターについての基本的な理解があることを前提としています。未経験の方は、コネクター ガイドを参照して始めてください。

はじめに

SendGrid（すなわち Twilio SendGrid）は、トランザクションおよびマーケティングメールのための顧客コミュニケーションプラットフォームです。そのメール送信機能を使用して、認証コード を送信できます。

SendGrid アカウントを登録する

SendGrid のウェブサイトで新しいアカウントを作成します。すでにアカウントをお持ちの場合は、このステップをスキップできます。

送信者を確認する

SendGrid コンソールページにアクセスし、SendGrid アカウントでサインインします。

送信者は、検証コードのメールが送信されるアドレスを示します。SendGrid メールサーバーを介してメールを送信するには、少なくとも 1 つの送信者を確認する必要があります。

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 または Mail Send へのフルアクセスを持つ Restricted Access が必要です。

API キーは、Create API Key プロセスを完了するとすぐに画面に表示されます。この API キーは安全な場所に保存してください。これが唯一の表示機会です。

コネクターを設定する

「API キーを作成する」セクションで作成した API キーを apiKey フィールドに入力します。

送信者の From Address と Nickname を fromEmail と fromName フィールドに入力します。送信者の詳細は "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'