Next-auth: Docs say use SMTP, but Nextjs doesn't support SMTP

[alex-cory]

I'm currently going through the process of setting up the email provider in my nextjs app. I came accross this documentation saying nextjs's serverless functions don't support SMTP, but the next-auth documentation says to use SMTP. Am I missing something? I haven't fully got everything set up yet so it might work fine, but thought I'd point this out.

[alex-cory]

I got it to work, it's just pretty confusing. Here's the steps I took for other people if you're using sendgrid.

Providers

// /api/auth/[...nextauth].js
import NextAuth from 'next-auth'
import Providers from 'next-auth/providers'

const emailHost = 'smtp.sendgrid.net'
const emailUsername = 'apikey' // <- don't replace "apikey" it's the actual username
const emailPassword = 'your-actual-sendgrid-api-key'

const options = {
  site: process.env.SITE || 'http://localhost:3000',

  // Configure one or more authentication providers
  providers: [
    // Sign in with passwordless email link
    Providers.Email({
      server: `smtp://${emailUsername}:${emailPassword}@${emailHost}:587`,
      from: '[email protected]'
    }),
  ],

  // A database is optional, but required to persist accounts in a database
  database: process.env.USER_DB_URL,
}

export default (req, res) => NextAuth(req, res, options)

Create your sendgrid account.
Then create your api key (see docs) and then add them to your code (like what's above).

Then authenticate your domain in sendgrid. You must be signed in for that link to work.

Once you do that^ it'll give you 3 CNAME records that you need to add to your domain like these:
| Host | Value |
| ---- | --------- |
| em9321.example.com | u121243125743.wl214.sendgrid.net |
| s1._domainkey.example.com | s1.domainkey.u121243125743.wl214.sendgrid.net |
| s2._domainkey.example.com | s2.domainkey.u121243125743.wl214.sendgrid.net |

Then open up the DNS records in vercel.
Currently the url is: https://vercel.com/dashboard/<USERNAME>/domains/<YOUR_URL>

And add the CNAME records. Here's where it was a little confusing.
Vercel CNAME records need to look like:
| Name | Value |
|--------------------|-----------------------------------------------|
| em9321.example.com | u121243125743.wl214.sendgrid.net |
| s1._domainkey | s1.domainkey.u121243125743.wl214.sendgrid.net |
| s2._domainkey | s2.domainkey.u121243125743.wl214.sendgrid.net |

Then go back to sendgrid and click the Verify button to make sure all is good.

[iaincollins]

@alex-cory Thanks for raising this and for following up with an update.

I have Vercel with a number of SMTP services (IIRC AWS SES, SendGrid, Mailgun, Sendinblue, Google).

The example project uses SMTP. Anecdotally it seems like secure traffic on 587 is allowed and I think port 25 is blocked (which is quite typical) but I will ask if this is intended or likely to be deprecated.

I will ask Vercel folks if they can clarify and update the docs for NextAuth.js accordingly.

[LoriKarikari]

@iaincollins I came across this on the Vercel website. They recommend using an API.