Integrieren Sie Telefonanrufe und WhatsApp mit OpenAI

Einführung

Generative KI ist zum Mainstream geworden. Im letzten Jahr sind Modelle und Produkte wie ChatGPT und DALL-E 2 auf den Markt gekommen, mit denen Sie Texte, Bilder und Audiodaten generieren können. Die Schöpfer von ChatGPT und DALL-E 2, OpenAI, haben diese leistungsstarken Tools für Entwickler zugänglich gemacht, die damit fantasievolle neue Anwendungen erstellen können.

Dieser Artikel befasst sich zunächst mit der Integration der Vonage Sprach-API und OpenAI-API. Wir werden eine Anwendung erstellen, die eine Eingabeaufforderung von einem Benutzer per Telefonanruf erhält und diese an einen generativen KI-Dienst sendet. Die Antwort der KI wird an den Benutzer mit Vonage-Nachrichten-API. Tauchen wir ein!

Voraussetzungen

Wir haben bereits eine Vonage-Starteranwendung entwickelt, um einen Anruf zu empfangen, eine Benutzerantwort zu erfassen, sie an OpenAI zu senden und dann eine WhatsApp-Antwort zu senden. Mit der Starter-Anwendung müssen Sie nur Ihre Anmeldeinformationen in die .env-Datei einfügen und die App über Github Codespaces bereitstellen. Sie können die Startanwendung auch bearbeiten und experimentieren.

Um loszulegen:

• Fork dieses Repository. Öffnen Sie es in Codespaces, indem Sie auf "Create codespace on main" klicken.

• Vonage CLI - Sobald Node.js installiert ist, können Sie npm install -g @vonage/cli verwenden, um es zu installieren. Mit diesem Tool können Sie Ihre Vonage-Anwendungen erstellen und verwalten.

Alternativ können Sie die Anwendung auch mit Node.js und ngrok.

Erstellen einer neuen Vonage-Anwendung

Kostenlos anmelden/registrieren entwickler.vonage.deum die Vonage Voice API nutzen zu können. Vonage Sprach-APInutzen zu können, müssen Sie eine Vonage-Anwendung über das Entwicklerportal erstellen.

Alle Anfragen an die Vonage Voice API erfordern eine Authentifizierung. Daher sollten Sie mit der Anwendungs-API einen privaten Schlüssel generieren, mit dem Sie JSON-Web-Token (JWT) erstellen können, um die Anfragen zu stellen. Für Demozwecke werden wir den API-Schlüssel und das API-Geheimnis verwenden.

Im linken Menü hierklicken Sie auf API-Einstellungen. Auf der Registerkarte API-Schlüssel finden Sie Ihren API-Schlüssel und Ihr Kontogeheimnis (API-Geheimnis).

Kopieren Sie innerhalb der Codespaces-Umgebung den API-Schlüssel und das API-Geheimnis und fügen Sie sie in die .env-Datei ein. Achten Sie darauf, diese Informationen nicht im Github-Repository selbst zu speichern.

API_KEY=b**********
API_SECRET=******************

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

Lassen Sie uns eine Anwendung mit Vonage Developer Dashboard erstellen.

Klicken Sie im Menü auf der linken Seite auf Anwendungen. Klicken Sie dann auf "Eine neue Anwendung erstellen". Sie müssen Ihrer Anwendung einen Namen geben. Zum Beispiel "VoiceApp". Außerdem müssen Sie einen öffentlichen und einen privaten Schlüssel erstellen. Aktivieren Sie abschließend die Sprachfunktionen.

Überprüfen Sie es mit Vonage CLI.

Konfiguration einstellen

Erwartetes Ergebnis

Wir müssen eine virtuelle Nummer für unsere App kaufen, damit wir Anrufe annehmen können. Sie können dies mit der Vonage CLI tun:

• Virtuelle Rufnummern suchen und kaufen.

• Wählen Sie die Nummer mit den genannten Voice in der Spalte Fähigkeiten.

• Wir können die Nummern nach Ländervorwahlen suchen. Die Vonage Nummern API verwendet ISO-Alpha-2-Codes. Die aufgeführten Ländercodes finden Sie hier.

Mit dem folgenden CLI-Befehl können wir eine virtuelle Nummer kaufen:

Oder suchen und kaufen Sie virtuelle Telefonnummern mit Vonage Dashboard. Wählen Sie die Sprachfunktion aus dem Dropdown-Menü.

Unsere App finden

Verknüpfung von Telefonnummer und der App

Zum Beispiel

Erwartete Antwort:

Sie können Nummern auch über das Vonage Dashboard verknüpfen. Gehen Sie zu Anwendungen, öffnen Sie die entsprechende App (z. B. VoiceApp) und klicken Sie in der Liste der Nummern auf die Schaltfläche "Verknüpfung".

Call-Control-Objekt erstellen

Spracherkennung (ASR)

Die automatische Spracherkennung (ASR) ermöglicht es Anwendungen, die Spracheingabe für Fälle wie IVR, Identifizierung und verschiedene Arten von Sprachbots/-assistenten zu unterstützen. Mit dieser Funktion empfängt unsere Anwendung transkribierte Benutzersprache (in Textform), sobald sie erwartet, dass der Benutzer eine Frage durch Sprechen und nicht durch die Eingabe von Ziffern (DTMF) beantwortet, und kann dann den Anruffluss gemäß ihrer Geschäftslogik auf der Grundlage dessen fortsetzen, was der Benutzer gesagt hat. Das folgende Schema zeigt, wie unsere Anwendung mit der Vonage API über das Nexmo Call Control Object (NCCO) interagiert.

Sie können die Eingabeaktion verwenden, um die getippten Ziffern oder die Spracheingabe eines Benutzers zu erfassen. Diese Aktion ist synchron; Vonage verarbeitet die Eingabe und leitet sie an den eventUrl Webhook-Endpunkt weiter. Sie konfigurieren ihn so, dass er diese Eingaben in Ihrer Anfrage empfängt. Ihr Webhook-Endpunkt sollte ein anderes NCCO zurückgeben, das das bestehende NCCO ersetzt und den Anruf basierend auf der Benutzereingabe steuert.

Wie das alles funktioniert, können wir in unserer index.js Datei. Zunächst wartet die App darauf, dass sie am webhook/answer Endpunkt. Dann fährt die Anwendung mit den drei Aktionen fort:

{
      action: 'talk',
      text: 'Hi, describe an image that you want to generate'
    },
    {
      eventMethod: 'POST',
      action: 'input',
      eventUrl: [
        '[Codespace-or-server-URL]/webhooks/asr'],
      type: [ "speech" ],
      speech: {
        language: 'en-gb',
        endOnSilence: 0.1
      }
    },
    {
      action: 'talk',
      text: 'Thank you'
    }

Nützliche Links:

• Validierung des Nexmo Call Control Object (NCCO)

• Erkennungseinstellungen

Konfigurieren Sie Open AI

OpenAI hat neue Funktionen zur Bilderzeugung mit ihren DALL-E-Modellen veröffentlicht. Es gibt ein paar Dinge, die sehr cool an der Open AI API sind. Erstens erhalten Nutzer ab Januar 2023 ein kostenloses Guthaben in Höhe von 18 Dollar, das sie in den ersten drei Monaten nutzen können. Das ist eine Menge Guthaben, mit dem man spielen kann! Sie können zum Beispiel 900 Bilder erstellen oder bearbeiten 1024x1024. Zweitens heißt es im Kapitel "Ihre Inhalte" in den Nutzungsbedingungen von OpenAI: "... OpenAI überträgt Ihnen hiermit alle Rechte, Titel und Interessen an und in Bezug auf Output". Das bedeutet, dass Sie die generierten Bilder für jegliche Nutzung, auch für kommerzielle Zwecke, vollständig besitzen.

Erstens, nachdem Registrierung von und der Bestätigung Ihrer Telefonnummer, müssen Sie Ihren API-Schlüssel.

Mit diesem API-Schlüssel können wir weitermachen.

Fügen Sie es in Ihre .env Datei

API_KEY=b**********
API_SECRET=******************
OPENAI_API_KEY=sk-**************************************

In diesem Lernprogramm verwenden wir Bilder-API um ein Bild zu erzeugen.

Um ein Bild zu erzeugen, verwenden wir die folgende POST-Anfrage.

var req = unirest('POST', 'https://api.openai.com/v1/images/generations')
    .headers({
      'Content-Type': 'application/json',
      'Authorization': 'Bearer ' + openaiApiKey
    })

Mit der folgenden JSON-Nutzlast. Wo Sie Parameter verwalten können

• n - die Anzahl der erzeugten Bilder, Sie können 1-10 Bilder auf einmal anfordern

• size - verfügbare Größen 256x256, 512x512 oder 1024x1024 Pixel. Kleinere Größen sind schneller zu erzeugen.

.send(JSON.stringify({
      "prompt": promptText,
      "n": 1,
      "size": "1024x1024"
    }))

Der Prompt-Text, den wir aus der Antwort des Benutzers, die wir als Webhook erhalten, analysieren werden.

let promptText = request.body.speech.results[0].text

Nachdem wir eine Antwort von OpenAI API erhalten haben, werden wir die Bild-URL aus dem Textkörper analysieren.

let imgUrl = res.body.data[0].url

Konfigurieren der Vonage Nachrichten-API

Mit der Vonage Messages API können Sie Nachrichten über SMS, MMS, Facebook Messenger, Viber und WhatsApp senden und empfangen! In unserem Anwendungsfall verwenden wir WhatsApp, aber Benutzer können den Code ändern und Facebook oder Viber verwenden. Weitere Informationen finden Sie in der Dokumentation der Nachrichten-API."

Wir verwenden die Vonage Messages API WhatsApp Sandbox, um eine Nachricht mit Inhalt oder einem Link zu empfangen.

Wir haben die Funktion sentMsg Funktion, die zwei Parameter erhält, phoneNumberder Informationen über die Telefonnummer des Anrufers enthält. Und imgUrl die wir aus der OpenAI-Antwort parsen.

function sentMsg(phoneNumber, imgUrl)

Öffnen Sie WhatsApp auf Ihrem Smartphone, und klicken Sie auf das Fotosymbol. Scannen Sie dann den QR-Code und klicken Sie auf "Senden" in der vorausgefüllten Nachricht.

Öffnen Sie Nachrichten API Sandbox wenn Sie zusätzliche Informationen benötigen oder einen anderen Messenger verwenden möchten.

Unsere App im Codespace bereitstellen

Öffnen Sie den GitHub Codespace in Ihrem Fork.

Führen Sie im Codespace-Terminal den folgenden Befehl aus, um unsere Node-Pakete zu installieren:

npm install

Führen Sie den folgenden Befehl im Terminal aus, um die GitHub Codespace-URL für Webhooks zu erhalten

echo "https://${CODESPACE_NAME}-3000.preview.app.github.dev/webhooks/asr"

Kopieren Sie die Ausgabe und fügen Sie sie in EVENT_URL= in die .env Datei ein.

API_KEY=b**********
API_SECRET=******************
OPENAI_API_KEY=sk-**************************************
EVENT_URL=https://******************************************-3000.preview.app.github.dev/webhooks/asr

Jetzt müssen wir unsere Vonage App-Einstellungen aktualisieren, um auf unsere CodeSpace-Webhooks zu hören. Dies können wir über das Dashboard. Gehen Sie im linken Menü auf Anwendung. Wählen Sie unsere aktuelle App und klicken Sie auf die Schaltfläche "Bearbeiten".

Aktualisieren Sie die App-Einstellungen mit Vonage CLI. Fügen Sie Ihre Codespace-URL oder Server-URL anstelle von [Codespace-or-server-URL] in den folgenden CLI-Befehl ein

Ausführen der App

Öffnen Sie im Terminal die Registerkarte Port Registerkarte. Klicken Sie auf Private in der Spalte Visibility und ändern Sie sie in Public.

Alles ist bereit

• Probieren Sie es aus, indem Sie die Nummer anrufen, die mit der App verknüpft ist **732**56**

• Sag dem Bot deinen Tipp

• Warten Sie auf den Inhalt des entsprechenden Boten

• Überwachen Sie die Konsole

Nachfolgend finden Sie ein Beispielbild, das Sie auf Ihrem Telefon empfangen können.

Aufforderungstext: Ukrainische Karpaten Gebirgswiese, Fotografie, fotorealistisch 8K, HD

Nachbereitung

Herzlichen Glückwunsch! Sie haben jetzt einen Bot-Antwortdienst für eingehende Anrufe mit der Vonage Voice API erstellt, der Nachrichten mit der Vonage Messages API sendet. Und das alles ist auf GitHub Codespaces gehostet. Sie können dieses Projekt erweitern mit Vonage AI Studioerweitern und einen dynamischen Workflow hinzufügen, um je nach Anrufereingabe unterschiedlich zu reagieren. Oder, da wir bereits mit OpenAI integriert haben, könnten Sie ChatGPT integrieren.

Zeigen Sie Ihre KI-Kreationen oder lassen Sie uns wissen, wie wir Ihnen helfen können! Beteiligen Sie sich am Gespräch auf unserem Vonage Community Slack oder senden Sie uns eine Nachricht auf Twitter.