DEV Community

Cover image for Send email confirmation in Strapi v4
Lê Vũ Huy
Lê Vũ Huy

Posted on • Updated on

Send email confirmation in Strapi v4

I have spent 1 hour to search internet for this feature but encountered a few obstacles. So I write this tutorial, hope it helps someone 😄

First, you need a SMTP mail server to send verification email. Luckily, Sendgrid provide this. In this tutorial, I will guide you to send email from your domain email, using Sendgrid as a mail server.

1. Verify your domain on Sendgrid

Go to Sender authentication page, then click Authenticate Your Domain to start the process, they will ask you to add some DNS record to your domain. The result should look like this:

Image description
Next, go to Setting -> API Keys and create a new API Key for this email.

2. Config SMTP on strapi

In .env file in your strapi project, add

URL=http://localhost:1337
Enter fullscreen mode Exit fullscreen mode

config strapi url:

// /config/server.js

module.exports = ({env}) => {
    ...
    url: env("URL", "http://localhost:1337"),
})
Enter fullscreen mode Exit fullscreen mode

Install email plugin using this command:

yarn add @strapi/provider-email-nodemailer
Enter fullscreen mode Exit fullscreen mode

Add SMTP config to your .env file

SMTP_HOST=smtp.sendgrid.net
SMTP_PORT=465
SMTP_USERNAME=apikey
SMTP_PASSWORD=<your api key from step 1>
Enter fullscreen mode Exit fullscreen mode

Create a file name plugins.js in config folder

// /config/plugin.js

module.exports = ({ env }) => ({
  email: {
    config: {
      provider: 'nodemailer',
      providerOptions: {
        host: env('SMTP_HOST', 'smtp.sendgrid.net'),
        port: env('SMTP_PORT', 465),
        auth: {
          user: env('SMTP_USERNAME'),
          pass: env('SMTP_PASSWORD'),
        },
      },
      settings: {
        defaultFrom: 'hello@example.com', 
        defaultReplyTo: 'hello@example.com',
      },
    },
  },
});
Enter fullscreen mode Exit fullscreen mode

The defaultFrom and defaultReplyTo are email from your domain, it can be any email such as support@yourdomain.com, admin@yourdomain.com,...

yarn build
yarn develop --watch-admin
Enter fullscreen mode Exit fullscreen mode

3. Test send mail

Now go to admin dashboard on http://localhost:8000, navigate to Settings -> Email plugin -> Configuration, enter your email and Send test email, if everything is setup correctly, you should receive an email 😎

Image description

4. Send verification email

You are almost done, now navigate to Settings -> Advanced setting, turn on the Enable email confirmation. Next, enter the Redirection url below, it should be a page on your site to display the text Congratulation! You have successfully confirmed your email

Image description

Don't hesitate to ask me if you have any question 😁 @huylvz

Top comments (0)