Vercel Edge Emails
Send free transactional emails from your Vercel edge functions through Cloudflare and MailChannels
How it works
This package only works with Vercel edge functions. Vercel edge functions are serverless functions that run on the edge of the Cloudflare network. Thus, we can take advantage of Cloudflare's free outbound email service which is a result of their partnership with MailChannels. To learn more, visit the Cloudflare blog post.
Getting Started!
Install the package
npm install vercel-email
Create a new edge function
// If you're using App directory
export const runtime = 'edge';
// If you're using Pages directory
export const config = {
runtime: 'edge',
};
Import the package
import Email from 'vercel-email';
Setup SPF
SPF is a DNS record that helps prevent email spoofing. You will need to add an SPF record to your domain to allow MailChannels to send emails on your behalf.
- Add a
TXT
record to your domain with the following values:- Name:
@
- Value:
v=spf1 a mx include:relay.mailchannels.net ~all
- Name:
Setup DKIM
This step is optional, but highly recommended. DKIM is a DNS record that helps prevent email spoofing. You may follow the steps listed in the MailChannels documentation to set up DKIM for your domain.
Usage
Basic Email
The Most basic request would look like this:
await Email.send({
to: '[email protected]',
from: '[email protected]',
subject: 'Hello World',
text: 'Hello World',
});
HTML Emails
You can also send HTML emails by adding an html
parameter to the request. This can be used in conjunction with the text
parameter to send a multi-part email.
await Email.send({
to: '[email protected]',
from: '[email protected]',
subject: 'Hello World',
html: '<h1>Hello World</h1>',
});
Sender and Recipient Name
You can also specify a sender and recipient name by adding a name
parameter to the request. This can be used for both the to
and from
parameters.
await Email.send({
to: { email: '[email protected]', name: 'John Doe' },
from: { email: '[email protected]', name: 'Jane Doe' },
subject: 'Hello World',
text: 'Hello World',
});
Sending to Multiple Recipients
You may also send to multiple recipients by passing an array of eamils, or an array of objects with email
and name
properties.
await Email.send({
to: ['[email protected]', '[email protected]'],
from: '[email protected]',
subject: 'Hello World',
text: 'Hello World',
});
or
await Email.send({
to: [
{ email: '[email protected]', name: 'John Doe' },
{ email: '[email protected]', name: 'Rose Doe' },
],
from: '[email protected]',
subject: 'Hello World',
text: 'Hello World',
});
Sending BCC and CC
You can also send BCC and CC emails by passing an array of eamils, an object with email
and name
properties, or an array of either, similar to the to
parameter.
await Email.send({
to: '[email protected]',
from: '[email protected]',
subject: 'Hello World',
text: 'Hello World',
cc: ['[email protected]', '[email protected]'],
bcc: ['[email protected]'],
});
Reply To
You can also specify a reply to email address by adding a replyTo
parameter to the request. Again, you can use an email string, an object with email
and name
properties, or an array of either.
await Email.send({
to: '[email protected]',
from: '[email protected]',
replyTo: '[email protected]',
subject: 'Hello World',
text: 'Hello World',
});