otp.mdx

title	description
OTP (One-Time Password)	Send OTPs without setting up your own infrastructure

Intro

Sending One-Time Passwords (OTP) is often unnecessarily complicated, requiring engineering teams to waste valuable development cycles setting up SMS infrastructure and getting email reputation satisfactory for sending six digit passcodes. This three channel workflow example shows how to send an email, push notification, or SMS OTP.

Explore the source code on GitHub

Preview

Send an email <img style={{ borderRadius: '0.5rem' }} src="/images/how-to/otp-email.png" />

Send a mobile push notification <img style={{ borderRadius: '1.5rem' }} src="/images/how-to/otp-push.png" />

Send an SMS notification <img style={{ borderRadius: '1rem' }} src="/images/how-to/otp-sms.png" />

Code Sample

import { workflow } from '@novu/framework';
import { renderOtpEmail } from '../emails/slack-otp';
import { zodControlSchema, zodPayloadSchema, zodPushControlSchema, zodSmsControlSchema } from './schemas';

export const SlackVerificationOTP = workflow(
  "Slack Verify OTP",
  async ({ step, payload }) => {
    await step.email(
      "send-email",
      async (controls) => {
        return {
          subject: controls.emailSubject,
          body: renderOtpEmail(controls, payload),
        };
      },
      {
        controlSchema: zodControlSchema
      });

    // -----------------------------------push flow-------------------------------------------------------------------------
    await step.push('send-push', async (controls) => {
      return {
        subject: controls.pushNotificationSubject,
        body: `Your verification code from Slack is ${payload.validationCode}`,
      };
    },
    {
      controlSchema: zodPushControlSchema
    });

    // -----------------------------------sms flow-------------------------------------------------------------------------  
    await step.sms('send-sms', async (controls) => {
      return {
        subject: controls.smsSubject,
        body: `Your verification code from Slack is ${payload.validationCode}`,
      };
    },
    {
      controlSchema: zodSmsControlSchema
    });
  },
  {
    payloadSchema: zodPayloadSchema
  },
);