Text-to-Speech-Telefonanrufe in ASP.NET

Einführung

Die Entwicklung einer hochwertigen Voice-Anwendung ist mit der Vonage Voice API. Sie ermöglicht es Ihnen unter anderem, mit Ihren ASP.NET Applications Telefonanrufe zu tätigen und zu empfangen.

In diesem Tutorial werden wir ein ASP.NET-Projekt in Visual Studio einrichten, das die Vonage Voice API verwendet, um einen Text-to-Speech-Anruf mit ASP.NET zu tätigen.

Voraussetzungen

Bevor Sie beginnen, vergewissern Sie sich, dass Sie die folgenden Informationen haben:

• Visual Studio 2022 - Community Edition oder höher installiert. Sie können auch eine frühere Version von Visual Studio verwenden, beginnend mit Visual Studio 2017.

• Vonage CLI - Optional - Sobald Node.js installiert ist, können Sie mit npm install -g @vonage/cli installieren. Mit diesem Tool können Sie Ihre Vonage Applications erstellen und verwalten, ohne das Developer Portal zu nutzen.

Konfigurieren einer Vonage-Anwendung

Für die Nutzung der Vonage Voice APInutzen zu können, müssen Sie eine Vonage-Applikation über das Entwicklerportal erstellen.

Eine Vonage Applikation enthält die Sicherheits- und Konfigurationsinformationen, die Sie für die Interaktion mit den Vonage Voice APIs benötigen.

Alle Anfragen an die Vonage Voice API erfordern eine Authentifizierung. Sie müssen mit der Application API einen privaten Schlüssel generieren, mit dem Sie JSON Web Tokens (JWT) erstellen können, um die Anfragen zu stellen.

Die zugehörigen öffentlichen und privaten Schlüssel der Anwendung können auf zwei Arten erstellt werden:

• Über das Vonage Entwickler-Portal

• Über die Vonage CLI

Für dieses Tutorial verwenden wir das Vonage Developer Dashboard.

Das Vonage Dashboard für Entwickler

Loggen Sie sich in das Vonage Developer Dashboard ein und suchen Sie den Abschnitt ApplicationsHier können Sie eine neue Anwendung erstellen. Stellen Sie sicher, dass die Voice wie unten gezeigt eingeschaltet ist, und drücken Sie Neue Anwendung erstellen.

create-voice-application.png

Sie können eine Nummer verknüpfen, wenn Sie möchten, aber für dieses Tutorial ist das nicht notwendig.

Gehen Sie zurück in die Anwendung, die Sie gerade erstellt haben, und drücken Sie Öffentlichen und privaten Schlüssel generieren Dies wird Sie auffordern, Ihren privaten Schlüssel herunterzuladen und den öffentlichen Schlüssel für Sie zu erstellen. Bitte bewahren Sie diese Informationen sicher auf, da jeder, der Zugang dazu hat, Ihren Account nutzen kann!

create-voice-application-keys.png

ASP.Net Web-Projekt einrichten

Nachdem wir nun unser öffentliches/privates Schlüsselpaar und unsere Vonage Voice-Anwendung über das Entwickler-Dashboard generiert haben, wollen wir uns nun ansehen, wie wir unser ASP.NET-Projekt in Visual Studio konfigurieren sollten.

Starten Sie zunächst Visual Studio (Community Edition oder höher), wählen Sie Neues Projekt erstellen und wählen Sie ASP.NET Core Web App (Model-View-Controller) wie unten gezeigt.

new-asp-net-core-web-app-project.png

Geben Sie Ihrem Projekt einen Namen und drücken Sie Weiter. Für Rahmenwerkstellen Sie sicher, dass es eingestellt ist auf .NET 6.0 eingestellt ist, lassen Sie die anderen Optionen auf ihren Standardeinstellungen und drücken Sie die Erstellen Schaltfläche.

AdditionalInfo.png

Installieren des Vonage .NET SDK

Unter Lösungs-Explorermit der rechten Maustaste auf Abhängigkeiten und wählen Sie NuGet-Pakete verwalten. Wählen Sie nun die Option durchsuchen. und suchen Sie nach Vonage. Sie sehen dann Vonage angezeigt und drücken Sie installieren. auf der neuesten stabilen Version (6.03 zum Zeitpunkt der Erstellung dieses Dokuments).

InstallVonage.png

Konfiguration Einstellungen

Öffnen Sie die appsettings.json Datei, die bereits zu Ihrem Projekt hinzugefügt wurde. Darin müssen Sie die Datei appSettings hinzufügen und das entsprechende Feld mit den für Ihre Anwendung spezifischen Daten ausfüllen (siehe unten).

• VONAGE_ANWENDUNG_ID - befindet sich in der Voice Application, die Sie zuvor im Vonage Developer Dashboard erstellt haben.

• VONAGE_PRIVATE_KEY_PATH - sollte ein direkter Link zu Ihrem privaten Schlüsselpfad sein.

• VONAGE_VON_DER_NUMMER - ist die Nummer, auf die Sie vorhin verwiesen haben.

{
  "Logging": {
    "LogLevel": {
      "Default": "Information",
      "Microsoft.AspNetCore": "Warning"
    }
  },
  "appSettings": {
    "VONAGE_APPLICATION_ID": "VONAGE_APPLICATION_ID",
    "VONAGE_PRIVATE_KEY_PATH": "VONAGE_PRIVATE_KEY_PATH",
    "VONAGE_FROM_NUMBER": "VONAGE_FROM_NUMBER"
  },
  "AllowedHosts": "*"
}

Definieren der Ansicht (UI)

Lassen Sie uns nun die Seite erstellen, die dem Endbenutzer präsentiert wird.

Wählen Sie Ansichten und fügen Sie einen neuen Ordner namens Voice. Erstellen Sie in diesem Ordner eine neue Ansicht namens Anrufe tätigen. Fügen Sie dann den folgenden Code in die Seite ein, damit der Benutzer eine Telefonnummer eingeben kann, die unsere Anwendung anrufen soll, und eine Senden Schaltfläche, um das Formular abzuschicken.

@using (Html.BeginForm("MakeCall", "Voice", FormMethod.Post))
{
    <input type="text" name="to" id="to" placeholder="To" />
    <input type="submit" value="Call" />
}

Jetzt erstellen wir einen Link zur Ansicht, indem wir zu Ansichten dann Startseite und bearbeiten die Index.cshtml Datei mit folgendem Inhalt.

@{
    ViewData["Title"] = "Home Page";
}

<div class="text-center">
    <h2>@Html.ActionLink("Create Call", "MakeCall", "Voice")</h2>
</div>

Hinzufügen des Controllers (Geschäftslogik)

Erstellen Sie einen neuen Controller namens VoiceController.cs in den wir den folgenden Code einfügen werden.

using Microsoft.AspNetCore.Mvc;
using System.Diagnostics;
using Vonage;
using Vonage.Request;
using Vonage.Voice.Nccos.Endpoints;
using Vonage.Voice;
using Vonage.Numbers;
using Vonage.Voice.Nccos;

namespace TextToSpeechVonage.Controllers
{
    public class VoiceController : Controller
    {
        public IActionResult Index()
        {
            return View();
        }

        [HttpGet]
        public ActionResult MakeCall()
        {
            return View();
        }

        [HttpPost]
        public async Task<ActionResult> MakeCallAsync(string to)
        {
            var VONAGE_FROM_NUMBER = Configuration.Instance.Settings["appsettings:VONAGE_FROM_NUMBER"];
            var VONAGE_TO_NUMBER = to;
            var vonageApplicationId = Configuration.Instance.Settings["appsettings:VONAGE_APPLICATION_ID"];
            var vonagePrivateKeyPath = Configuration.Instance.Settings["appsettings:VONAGE_PRIVATE_KEY_PATH"];
            
            var creds = Credentials.FromAppIdAndPrivateKeyPath(vonageApplicationId, vonagePrivateKeyPath);
            var client = new VonageClient(creds);

            var toEndpoint = new PhoneEndpoint() { Number = VONAGE_TO_NUMBER };
            var fromEndpoint = new PhoneEndpoint() { Number = VONAGE_FROM_NUMBER };

            var talkAction = new TalkAction() { Text = "This is a text to speech call from Vonage! " };
            var ncco = new Ncco(talkAction);

            var command = new CallCommand() { To = new Vonage.Voice.Nccos.Endpoints.Endpoint[] { toEndpoint }, From = fromEndpoint, Ncco = ncco };
            var response = await client.VoiceClient.CreateCallAsync(command);

            return RedirectToAction("MakeCall", "Voice");
        }
    }
}

In der MakeCallAsync Methode rufen wir die Vonage Application ID und den Pfad zum privaten Schlüssel ab und übergeben diese an den VonageClient als Anmeldeinformationen. Sobald der Client instanziiert ist, geben wir die Rufnummer an, die den Anruf sendet und empfängt. Dann geben wir den Text an, der dem Anrufer vorgelesen werden soll mit TalkAction den Text an, der dem Anrufer vorgelesen werden soll, und erstellen schließlich den Anruf asynchron, indem wir die Endpunkte einfügen. Sobald dies abgeschlossen ist, leiten wir zu unserer GET Methode namens MakeCall in der Voice Controller.

Ausführen der App

Starten Sie nun die Anwendung und führen Sie einen Text-to-Speech-Anruf durch.

create-call.png

Wenn er erfolgreich ist, ruft er die angegebene Nummer an, liest den Text und beendet schließlich den Anruf.

Je nach Netzbetreiber kann es zu einer Verzögerung kommen, bevor Ihr Telefon klingelt.

Nachbereitung

Nachdem Sie nun gelernt haben, wie Sie ASP.NET dazu bringen, einen Text-to-Speech-Anruf zu senden, können Sie dieses Projekt so erweitern, dass die Voice API auf den vom Anrufer gesendeten Text reagiert! Sie könnten auch versuchen, einige unserer Anwendungsfälle zu überprüfen, wie zum Beispiel dieses Projekt der einen Bot-Antwortdienst für eingehende Telefonanrufe erstellt.

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!