Voice OTP Using Node.js

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.