Erstellen eines interaktiven Voice Response-Menüs mit Node.js und Express

Einführung

Die Vonage Voice API ist der einfachste Weg, hochwertige Voice Applications in der Cloud zu erstellen.

In diesem Tutorial werden wir ein interaktives Voice-Response-Menü mit Hilfe der Vonage Voice API und Node.js erstellen, um eingehende Anrufe zu empfangen und Benutzereingaben über die Tastatur zu erfassen.

Als Referenz sollte die Quelldatei etwa so aussehen diese Datei aussehen, wenn diese Übung abgeschlossen ist.

Voraussetzungen

Bevor Sie beginnen, vergewissern Sie sich, dass Sie die folgenden Komponenten installiert haben:

• Node.js installiert. Node.js ist eine quelloffene, plattformübergreifende JavaScript-Laufzeitumgebung.

• ngrok - Ein kostenloser Account ist erforderlich. Mit diesem Tool können Entwickler einen lokalen Entwicklungsserver für das Internet freigeben.

• OPTIONAL - Vonage CLI Sobald Node.js installiert ist, installieren Sie die CLI durch Eingabe von npm install -g @vonage/cli. Mit diesem Tool können Sie Vonage Applications über eine Befehlszeilenschnittstelle erstellen und verwalten, im Gegensatz zum Vonage Developer Portal.

Erstellen einer Voice-fähigen Vonage-Applikation

So verwenden Sie die Vonage Voice APIzu nutzen, müssen Sie eine Vonage-Applikation über das Entwicklerportal erstellen.

Vonage API-Konto

Um dieses Tutorial durchzuführen, benötigen Sie ein Vonage API-Konto. Wenn Sie noch keines haben, können Sie sich noch heute anmelden und mit einem kostenlosen Guthaben beginnen. Sobald Sie ein Konto haben, finden Sie Ihren API-Schlüssel und Ihr API-Geheimnis oben auf dem Vonage-API-Dashboard.

Sind Sie bereit, mit dem Bau zu beginnen?

Erleben Sie nahtlose Konnektivität, Echtzeit-Messaging und kristallklare Sprach- und Videoanrufe - alles auf Knopfdruck.

Wir müssen die Webhooks der Anwendung konfigurieren und mehr. Bitte beachten Sie, dass dies über das Vonage Entwickler-Portal oder die Vonage CLI. Für dieses Tutorial verwenden wir das Vonage Developer Dashboard.

Nachdem Sie einen Account erstellt haben, loggen Sie sich in das Vonage Developer Dashboard ein und suchen Sie den Bereich Abschnitt Applicationsund erstellen Sie eine neue Anwendung. Geben Sie Ihrer Anwendung einen Namen, z. B. IVRMenu.

IVRMenuCall.png

Blättern Sie auf der Seite nach unten und stellen Sie sicher, dass die Option Voice Funktion aktiviert ist.

Notieren Sie sich die Antwortund Ereignis URLs, da wir diese in Kürze eingeben werden. Wir lassen die Fallback-URL für die Dauer dieses Lehrgangs leer lassen.

VoiceCapability.png

Drücken Sie Neue Anwendung generieren am Ende der Seite, um fortzufahren.

Für dieses Lernprogramm ist auch eine virtuelle Telefonnummer erforderlich. Um eine zu erwerben, gehen Sie zu Numbers > Buy Numbers und suchen Sie nach einer Nummer, die Ihren Anforderungen entspricht. Sobald Sie eine Numbers haben, verknüpfen Sie sie mit dem Vonage Developer Dashboard, wie unten gezeigt.

LinkedNumber.png

Als Nächstes werden wir ngrok verwenden, um unsere Webhook-Endpunkte auf unserem lokalen Rechner als öffentliche URL zu veröffentlichen.

Ngrok ausführen

ngrok ist eine plattformübergreifende Anwendung, die es Entwicklern ermöglicht, einen lokalen Entwicklungsserver mit minimalem Aufwand ins Internet zu stellen. Wir werden es verwenden, um unseren Dienst dem Internet zugänglich zu machen. Sobald Sie ngrok eingerichtet haben und eingeloggt sind (auch hier ist der kostenlose Account akzeptabel), führen Sie den folgenden Befehl aus:

ngrok http 3000

Nachdem ngrok ausgeführt wurde, erhalten Sie eine Weiterleitung URL, die wir später in diesem Artikel als Basis für unsere Webhooks verwenden werden. Meine sieht wie die folgende aus:

ngrok.png

Erinnern Sie sich an die Antwort und Ereignis URLs im Vonage Developer Portal, wie bereits erwähnt? Wir müssen die ngrok-URL verwenden und jedes Feld ausfüllen, indem wir /answer und /eventfür die Antwort-URL und die Ereignis-URL.

So kann zum Beispiel meine Antwort URL verweist auf https://9ebc-2601-600-9580-d650-fd8d-62dc-f5e4-b88e.ngrok.io/answer und Ereignis towards https://9ebc-2601-600-9580-d650-fd8d-62dc-f5e4-b88e.ngrok.io/event.

webhooksection.png

Wenn Sie die mit der Anwendung verknüpfte Nummer anrufen und diese antwortet, wird der Webhook, der in der Antwort-URL definierte Webhook ausgelöst. Ebenso werden Ereignisse mit einer POST-Anfrage protokolliert und beim Anruf der Nummer ausgelöst oder wenn die Nummer besetzt ist, usw.

Node.js-Projekt einrichten

Nachdem wir nun unsere Vonage Voice Application im Entwickler-Dashboard erstellt haben, wollen wir uns ansehen, wie wir unsere Node.js-Anwendung konfigurieren sollten.

Beginnen Sie damit, eine Eingabeaufforderung aufzurufen, ein Arbeitsverzeichnis zu erstellen und ein Node.js-Projekt zu initialisieren.

Wir bearbeiten die Anfragen mit Express und verwenden body-parser zum Parsen der eingehenden Anfragebodies. Installieren Sie beides wie folgt:

npm install express body-parser --save

Erstellen Sie eine index.js Datei, instanziieren Sie Express und den Body-Parser.

const app = require('express')()
const bodyParser = require('body-parser')

app.use(bodyParser.json())

Definieren wir den Endpunkt für die Antwort-URL als /answer und die Ereignis-URL als /event.

Wenn ein Benutzer eine Nummer auf seiner Tastatur drückt, können Sie über DTMF (Dual Tone Multifrequency) erfassen, welche Taste er gedrückt hat. Jedes Mal, wenn eine DTMF-Eingabe vom Benutzer erfasst wird, wird diese an unseren /dtmf Handler gesendet, den wir im nächsten Schritt definieren werden.

Erstellen Sie eine HTTP-GET-Route, um die Anfragen für /answer um Ihr NCCO abzurufen:

app.get('/answer', (req, res) => {
  const ncco = [{
      action: 'talk',
      bargeIn: true,
      text: 'Hello! Please enter a digit to continue.'
    },
    {
      action: 'input',
      maxDigits: 1,
      eventUrl: [`https://${req.get('host')}/dtmf`]
    }
  ]

  res.json(ncco)
})

Wir verwenden die talk Aktion, um den Anrufer zu begrüßen und ihn aufzufordern, eine Ziffer zu drücken, wobei die bargeIn Option auf true gesetzt, damit der Benutzer eine Ziffer eingeben kann, ohne auf das Ende der verbalen Nachricht zu warten.

Dann fügen wir ein input in den NCCO ein, um die Ziffer per DTMF zu erfassen. Setzen Sie die maxDigits Eigenschaft auf 1 und die eventURL auf einen Handler, um die Eingabe zu empfangen und zu verarbeiten. Bitte beachten Sie, dass Sie die Anzahl der Tastendrücke, die ein Benutzer machen kann, über die maxDigits Eigenschaft erweitern können.

Bearbeitung der Benutzereingaben

Fügen wir den Code zur Behandlung eingehender DTMF in index.js. Vonage stellt eine POST Anfrage an unseren Webhook, den wir als Endpunkt unter /dtmf. Wenn wir die Anfrage erhalten, erstellen wir eine weitere talk Aktion, die das Anforderungsobjekt untersucht und die Ziffern zurückliest, die der Anrufer gedrückt hat:

app.post('/dtmf', (req, res) => {
  const ncco = [{
    action: 'talk',
    text: `You pressed ${req.body.dtmf}`
  }]

  res.json(ncco)
})

Der Endpunkt für die event_url muss POST sein, also definieren wir /events:

app.post('/events', (req, res) => {
  console.log(req.body)
  res.send(200);

Dadurch werden alle ausgelösten Ereignisse in unserem Terminal/Befehlseingabefeld protokolliert.

Ausführen der Anwendung

Geben Sie an Ihrer Befehls-/Terminal-Eingabeaufforderung Folgendes ein, um die Anwendung auszuführen:

node index.js

Lassen Sie uns einen Anruf tätigen, um zu sehen, ob Ihre Anwendung funktioniert! Rufen Sie Ihre virtuelle Nummer von Ihrem Mobiltelefon aus an und drücken Sie eine Ziffer auf Ihrer Tastatur. Wenn alles funktioniert, sollten Sie die Nachricht hören, die Sie in Ihrem NCCO definiert haben: "Sie haben X gedrückt."

Nachbereitung

Nachdem Sie nun ein interaktives Sprachdialogmenü mit der Vonage Voice API und Node.js erstellt haben, sollten Sie lernen, wie man Text-to-Speech-Nachrichten in über 40 Sprachen senden können? Sie können auch mehr über unsere Voice API und tauchen Sie ein in mehrere fantastische Codeschnipsel.

Wenn Sie Fragen oder Feedback haben, besuchen Sie den Vonage Entwickler-Slack oder senden Sie mir einen Tweet auf Twitterund ich werde auf Sie zurückkommen. Nochmals vielen Dank fürs Lesen, und wir sehen uns beim nächsten Mal!