Supabase

Pingram integrates with Supabase in two ways:

1. Internal Auth Emails - Route Supabase’s built-in authentication emails (password resets, magic links, confirmations) through Pingram’s SMTP to bypass rate limits and gain email analytics.
2. Custom Notifications from Edge Functions - Send custom email and SMS from your Supabase backend code.

For a full walkthrough of every way to send mail from Supabase (SMTP, Edge Functions, webhooks, auth hooks, Node.js), see How to send emails with Supabase.

Internal Auth Emails (SMTP)

Hit the “Email rate limit exceeded” error? Route Supabase auth emails through Pingram to remove rate limits and get delivery analytics.

1. Go to Settings > SMTP in your Pingram dashboard
2. Click Integrate with Supabase and authorize
3. Select your project and enter a sender name/email

Your Supabase SMTP settings are automatically configured. Optionally, verify your domain in Settings > Domains to send from your own domain — see Domain Verification.

Custom Notifications from Edge Functions

Supabase’s internal emails only cover authentication flows. For custom notifications (user engagement, system alerts, collaboration), you need to build your own notification system.

This section shows you how to send custom notifications from Supabase Edge Functions. You can find the complete code in our GitHub repository.

Why Use Edge Functions?

Sending notifications requires API credentials that must stay secret. Frontend code is visible to everyone and can be modified by malicious users. Supabase Edge Functions keep your credentials secure on the server.

Step 1: Backend Implementation

First, install Pingram’s server SDK in your Supabase project:

npm install pingram

Now, let’s create a sample Supabase Edge Function to send a welcome notification:

supabase functions new send-welcome-notification

Here’s sample code for this function. It receives a recipient’s details and sends a welcome email (and optional SMS):

import { serve } from 'https://deno.land/std@0.168.0/http/server.ts';
import { Pingram } from 'npm:pingram';

const pingram = new Pingram({
  apiKey: Deno.env.get('PINGRAM_API_KEY')!
});

serve(async (req) => {
  const { email, phoneNumber, firstName } = await req.json();

  await pingram.email.send({
    type: 'welcome',
    to: email,
    subject: `Welcome${firstName ? `, ${firstName}` : ''}!`,
    html: `<h1>Welcome${firstName ? `, ${firstName}` : ''}!</h1><p>Thanks for signing up.</p>`
  });

  if (phoneNumber) {
    await pingram.sms.send({
      type: 'welcome',
      to: phoneNumber,
      message: `Welcome${firstName ? `, ${firstName}` : ''}! Thanks for signing up.`
    });
  }

  return new Response(JSON.stringify({ success: true }), {
    headers: { 'Content-Type': 'application/json' }
  });
});

Step 2: Pingram Configuration

1. Create a Pingram account if you don’t have one.
2. Create a notification with the ID welcome (or any other ID you prefer — just update it in the edge function).

Step 3: Test and Deploy

1. Set your Pingram API key (pingram_sk_...) as an environment variable for your Supabase function. Create a .env file in supabase/functions/send-welcome-notification/:

PINGRAM_API_KEY=pingram_sk_...

You can get this from API Keys in your Pingram dashboard.

2. Start Supabase locally to test your function:

supabase start
supabase functions serve send-welcome-notification --env-file ./supabase/functions/send-welcome-notification/.env

3. Use cURL or a client of your choice to test the function:

curl -i --request POST 'http://localhost:54321/functions/v1/send-welcome-notification' \
--header 'Authorization: Bearer YOUR_SUPABASE_ANON_KEY' \
--header 'Content-Type: application/json' \
--data-raw '{
    "email": "test@example.com",
    "firstName": "Alex"
}'

4. Once you’ve confirmed it works, deploy your function to Supabase:

supabase functions deploy send-welcome-notification

Step 4: Customize Your Messages

Edit the subject, html, and message fields in your edge function to match your product. You can interpolate values from the request body (like firstName above) to personalize each notification.

Security Best Practices

When implementing notifications, follow these security guidelines:

1. Keep Secrets Secure: Never expose your PINGRAM_API_KEY on the client-side. Using Supabase Edge Functions helps ensure it remains on the server.

2. Control Message Recipients and Content

   • Either limit who can receive messages (e.g., only to your team).
   • Or control what the message says using static templates in your edge function code.

3. Never Trust User Input

   • If you include user-provided content in notification messages, sanitize it to prevent injection attacks or spam. Bad actors could modify the message to send malicious content.

4. Implement Rate Limiting

   • Add limits to how many notifications a user can trigger to prevent abuse of the system. Supabase offers various ways to implement this at the edge function level.

Feedback and Support

If you have any questions or need help with your Supabase integration, feel free to reach out to us at support@pingram.io.