Voice OTP Using Node.js

Overview

This guide shows how to use a voice one-time password (OTP) to verify a mobile number. We first make a call to the phone number to be verified and use text-to-speech to read a random sequence of digits to the call recipients. The user then confirms the digits by entering them using dialpad keypresses. Voice OTP is commonly used to verify new user registrations for an app or website.

You can send a voice OTP either by using our PHLO visual workflow builder or our APIs and XML documents. Follow the instructions in one of the tabs below.

You can create a PHLO to implement a voice OTP with a few clicks on the PHLO canvas and trigger it with a few lines of code.

Prerequisites

To get started, you need a Plivo account — sign up with your work email address if you don’t have one already. If this is your first time triggering a PHLO with Node.js, follow our instructions to set up a Node.js development environment.

Create the PHLO

  • On the PHLO page of the Plivo console, click Create New PHLO.

  • In the Choose your use case pop-up, click Build my own. The PHLO canvas will appear with the Start node.

    Note: The Start node is the starting point of any PHLO. It lets you trigger a PHLO to start upon one of three actions: incoming SMS message, incoming call, or API request.
  • Click the Start node to open the Configuration tab to the right of the canvas, then enter the keys that you want to retrieve from the HTTP Request payload — in this case, from and to numbers and an OTP.

  • Validate the configuration by clicking Validate. Every time you finish configuring a node, click Validate to check the syntax and save your changes.

  • From the list of components on the left side, drag and drop the Initiate Call component onto the canvas. This adds an Initiate Call node onto the canvas. When a component is placed on the canvas it becomes a node.

  • Draw a line to connect the Start node‘s API Request trigger state to the Initiate Call node.

  • In the Configuration tab of the Initiate Call node, give the node a name. To enter dynamic values for fields, enter two curly brackets to view all available variables, and choose the appropriate ones: {{Start.http.params.from}} for the From field and {{Start.http.params.to}} for the To field, for example. The values for the variables will be retrieved from the HTTP Request payload you defined in the Start node.

  • Next, drag and drop the Play Audio component onto the canvas. Connect the Initiate Call node to the Play Audio node using the Answered trigger state.

  • Configure the Play Audio node to play a message to the user by entering text in the Speak Text box in the Prompt section of its Configuration tab.

    Under Speak Text, tick Amazon Polly as the text-to-speech processor and paste this XML code into the box:

1
2
3
4
5
6
7
8
<Speak voice="Polly.Amy">
    <prosody rate="medium">
        Your verification code is
    <break/>
    <break/>
    <say-as interpret-as="spell-out">{{Start.http.params.otp}}</say-as>
    </prosody>
</Speak>
  • After you complete and validate the node configurations, give the PHLO a name by clicking in the upper left, then click Save.

Your PHLO is now ready to test.

Trigger the PHLO

You integrate a PHLO into your application workflow by making an API request to trigger the PHLO with the required payload — the set of parameters you pass to the PHLO. You can define a static payload by specifying values when you create the PHLO, or define a dynamic payload by passing values through parameters when you trigger the PHLO from your application. An OTP application always uses a dynamic payload.

Create a file called TriggerPhlo.js and paste into it this code.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
const express = require('express');
const app = express();
const redis = require('redis');
const redisClient = redis.createClient();
var plivo = require('plivo');
var PhloClient = plivo.PhloClient;

var authId = "<auth_id>";
var authToken = "<auth_token>";
var phloId = "<phlo_id>";
var phloClient = phlo = null;

// Make call to the destination number with OTP
app.get('/dispatch_otp/:number', function(req, res) {
    const number = (req.params.number);
    const code = Math.floor(100000 + Math.random() * 900000);

    var client = new plivo.Client(auth_id, auth_token);
    var payload = {
        from: '<caller_id>',
        to: number,
        otp: code
    }
    phloClient = new PhloClient(authId, authToken);
    phloClient.phlo(phloId).run(payload).then(function(result) {
        console.log('Phlo run result', result);
    }).catch(function(err) {
        console.error('Phlo run failed', err);
    });
    redisClient.set(`number:${number}:code`, code, 'EX', 60);
    res.send(JSON.stringify({
        'status': 'success',
        'message': 'verification initiated'
    }));
});

// Validate the OTP entered by the user
app.get('/verify_otp/:number/:code', function(req, res) {
    const number = (req.params.number);
    const code = (req.params.code);
    redisClient.get(`number:${number}:code`, function(err, OriginalCode) {
        if (OriginalCode == code) {
            redisClient.del(`number:${number}:code`);
            res.send(JSON.stringify({
                'status': 'success',
                'message': 'codes match, number verified'
            }));
        } else if (OriginalCode != code) {
            res.send(JSON.stringify({
                'status': 'failure',
                'message': 'codes do not match, number not verified'
            }));
        } else {
            res.send(JSON.stringify({
                'status': 'failure',
                'message': 'number not found'
            }));
        }
    });
});
app.listen(5000);

Replace the auth placeholders with your authentication credentials from the Plivo console. Replace the phlo_id placeholder with your PHLO ID from the Plivo console. Replace the parameters with values from the PHLO. Phone number placeholders should be actual phone numbers in E.164 format (for example, +12025551234).

Test

Save the file and run it, and start Redis.

node TriggerPhlo.js
redis-server

You should see your basic server application in action as below:

http://localhost:5000/dispatch_otp/?destination_number=<destination_number>
http://localhost:5000/verify_otp/?destination_number=<destination_number>&otp=<otp>

Set up ngrok to expose your local server to the internet.

Here’s how to use Plivo APIs and XML to implement voice OTPs.

Prerequisites

To get started, you need a Plivo account — sign up with your work email address if you don’t have one already. If this is your first time using Plivo APIs, follow our instructions to set up a Node.js development environment.

Create a voice OTP application

Create a file called voiceotp.js and paste into it this code.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
const express = require('express');
const app = express();
const redis = require('redis');
const redisClient = redis.createClient();
var plivo = require('plivo');

// Make call to the destination number with OTP
app.get('/dispatch_otp/:number', function(req, res) {
    const number = (req.params.number);
    const code = Math.floor(100000 + Math.random() * 900000);

    var client = new plivo.Client("<auth_id>", "<auth_token>");
    var response = client.calls.create(
        "<caller_id>", // from
        number, // to
        "https://<yourdomain>.com/answer_url/" + code, // answer url
        {
            answerMethod: "GET",
        },
    )
    console.log(response)
    redisClient.set(`number:${number}:code`, code, 'EX', 60);
    res.send(JSON.stringify({
        'status': 'success',
        'message': 'verification initiated'
    }));
});

// Validate the OTP entered by the user
app.get('/verify_otp/:number/:code', function(req, res) {
    const number = (req.params.number);
    const code = (req.params.code);
    redisClient.get(`number:${number}:code`, function(err, OriginalCode) {
        if (OriginalCode == code) {
            redisClient.del(`number:${number}:code`);
            res.send(JSON.stringify({
                'status': 'success',
                'message': 'Codes match — number verified'
            }));
        } else if (OriginalCode != code) {
            res.send(JSON.stringify({
                'status': 'failure',
                'message': 'Codes do not match — number not verified'
            }));
        } else {
            res.send(JSON.stringify({
                'status': 'failure',
                'message': 'Number not found'
            }));
        }
    });
});

app.listen(5000);

Replace the auth placeholders with your authentication credentials from the Plivo console. Replace the phone number placeholder with an actual phone number in E.164 format (for example, +12025551234).

Note: We recommend that you store your credentials in the auth_id and auth_token environment variables, to avoid the possibility of accidentally committing them to source control. If you do this, you can initialize the client with no arguments and Plivo will automatically fetch the values from the environment variables. You can use process.env to store environment variables and fetch them when initializing the client.

Test

Save the file and run it, and start Redis.

$ node voiceotp.js
$ redis-server

You should see your basic server application in action as below:

http://localhost:5000/dispatch_otp/?destination_number=<destination_number>
http://localhost:5000/verify_otp/?destination_number=<destination_number>&otp=<otp>