Logo
    Resendを使ってSupabaseのメールを送信する

    Resendを使ってSupabaseのメールを送信する

    はじめに

    ゆとり世代の中野です。

    さっそくチャレンジについて書いていきます。

    チャレンジする背景

    • Supabase AuthenticationをSMTPの設定なしだと6通しか送れない
    • そのためSMTPを設定して制限を解除する必要がある

    チャレンジ内容

    • Resendを使ってSupabase Authenticationのメールを送信する

    やったこと

    Resendにドメインを追加する

    • Add domainを押下する
    • image
    • 取得しているドメインとRegionを設定しAddを押下する
    • image
    • DNS Recordsの内容が表示する
    • image
    • CloudflareでResendのDNS Recordsを追加する
    • image
    • ResendでVerify DNS Recordsボタンを押下し問題なければ数分後にステータスがVeriledに更新されます
    • image

    ResendのAPIキーを作成する

    • Create API Key を押下する
    • image
    • なんのKeyか分かるように命名してPermissionはSending accessを選択してDomainは取得しているドメインを選択してSaveを押下します
    • image
    • 作成したAPI Keyをコピペしておく
    • image
    • 以下が作成したAPI Keyの一覧
    • image

    SupabaseにSMTPの設定をする

    • Enable Custom SMTPを有効化して各フォームを入力する
      • Sender email: no-reply@自分のドメイン
      • Sender name: サービス名
      • Host: smtp.resend.com
      • Port: 465
      • Minium interval between emails being sent: 60
      • Username: resend
      • Password: YOUR_API_KEY
      • image
        image

    動作確認

    • Supabase Authenticationでインビのメールを飛ばしてみて設定が有効化されているか確認してください
    • Sender nameとSender emailで設定した内容でメールを受信できていたら成功です

    結論

    • Resendを使ってSupabase Authenticationのメールを送信できました

    さいごに

    やろうやろうと思いながら後回しにしてた設定が終わってよかったです

    Cloudflare - Resend

    Verify your domain on Cloudflare with Resend.

    resend.com

    Cloudflare - Resend
    Supabase with SMTP - Resend

    Learn how to integrate Supabase Auth with Resend SMTP.

    resend.com

    Supabase with SMTP - Resend

    yutanakano

    WEBエンジニア

    大阪生まれのゆとり世代です

    趣味はバイクでツーリングに行くこと

    愛車は Ninja ZX-25R SE KRT EDITION

    Expoでプロダクトを作っています

    image

    ©ゆとりちゃれんじ

    GitHubXInstagram