
Share:
)
Als ausgebildeter Schauspieler mit einer Dissertation in Standup-Comedy bin ich über die Meetup-Szene zur PHP-Entwicklung gekommen. Man findet mich, wenn ich über Technik spreche oder schreibe, oder wenn ich seltsame Platten aus meiner Vinylsammlung spiele oder kaufe.
Wie man WhatsApp-Nachrichten mit Laravel sendet
Lesedauer: 4 Minuten
Wenn Sie mit der Nachrichten-API nicht vertraut sind, können Sie Text, Bilder und Videos an Facebook Messenger, Viber, WhatsApp und den einfachen SMS-Kanal senden. Vonage verfügt über eine Sandbox-Testumgebung, in der Sie damit spielen können. In diesem Tutorial werden wir diese nutzen, um mit WhatsApp Messaging zu spielen, indem wir eine Demo-Laravel-Anwendung verwenden, die ich bereits eingerichtet habe.
Voraussetzungen
Wir werden dies so einfach wie möglich halten. Sie benötigen:
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.
In diesem Lernprogramm wird auch eine virtuelle Telefonnummer verwendet. Um eine zu erwerben, gehen Sie zu Rufnummern > Rufnummern kaufen und suchen Sie nach einer Nummer, die Ihren Anforderungen entspricht.
So klonen Sie den Repository-Code
Klonen Sie den Anwendungscode über die Befehlszeile:
git clone git@github.com:Vonage-Community/blog-messages-laravel.git
Kopieren Sie die .env.example
als .env
um unsere Umgebungsvariablendatei zu erstellen:
cd blog-messages-laravel
cp .env.example .env
Und schließlich installieren Sie die Abhängigkeiten mit Composer:
composer install
So richten Sie das Vonage Dashboard ein
Zunächst benötigen wir eine Anwendungs-ID, um Nachrichten zu versenden. Rufen Sie das Vonage Dashboard auf und erstellen Sie eine neue Anwendung:
Hit 'create a new Application' to get started
Benennen Sie Ihre Anwendung mit einem Bezeichner (z. B. laravel-messages) und aktivieren Sie die Nachrichtenfunktion. Sie müssen hier zwei Webhooks hinzufügen, aber wir werden diese nicht wirklich verwenden, also können Sie Dummy-Platzhalter einfügen, z. B. https://www.example.com
Klicken Sie auf "Öffentlichen und privaten Schlüssel generieren". Sie werden feststellen, dass ein private.key
generiert wird: Verschieben Sie diesen in das Stammverzeichnis Ihres Anwendungscodes. Notieren Sie sich die erstellte Anwendungs-ID: Wir werden sie in Kürze benötigen.
Damit sind die Anwendungseinstellungen erledigt, und wir müssen nun die Sandbox einrichten.
Besuchen Sie diese Seite oder navigieren Sie zu ihr über die linke Seitenleiste unter Troubleshoot & Learn > Developer Tools > Messages Sandbox
und folgen Sie den Anweisungen, um eine WhatsApp-Sandbox zu erstellen, indem Sie den QR-Code scannen.
Scan the QR code and follow the instructions to enable the Sandbox
Für eine vollständig integrierte Lösung in der Produktion benötigen Sie einen bei Meta registrierten WhatsApp Business Account (WABA). In der Sandbox können Sie ein temporäres WABA verwenden - Ihre Nummer steht nun auf einer Liste mit erlaubten Nummern, die mit den Servern von Vonage verknüpft sind.
Sobald die Nummer eingerichtet ist, können Sie nach unten scrollen, um einen cURL-Beispielcode zu sehen, der Ihnen die zu verwendende Absendernummer angibt:
Take note of the from number in this panel
Konfigurieren Sie die Anwendungsumgebung
Als wir die Datei .env
Datei erstellt haben, werden Sie feststellen, dass es drei Variablen gibt, die ausgefüllt werden müssen:
VONAGE_APPLICATION_ID=
VONAGE_PRIVATE_KEY_PATH=
VONAGE_FROM_NUMBER=
Wir sollten jetzt alle drei haben. Die from
Nummer wurde im vorherigen Schritt erstellt, geben Sie private.key
als unseren Pfad ein (der Anwendungscode verwendet die Laravel-Hilfsfunktion base_path(), um den voll qualifizierten Pfad zu ermitteln; wenn Sie also den Schlüssel in eine andere Verzeichnisstruktur verschieben wollten, müssten Sie dies relativ zum Stammverzeichnis tun). Unsere Anwendungs-ID kann aus dem Vonage Dashboard eingefügt werden, wenn wir eine Vonage-Anwendung erstellt haben.
Starten Sie die Anwendung
Keine ausgefallenen Sachen wie Segel oder Herde hier: Wir verwenden einfach den eingebauten PHP-Server, der von Laravel umschlossen wird:
php artisan serve
Und wir sollten die schöne Landing Page erhalten, indem wir zu folgender Adresse navigieren localhost:8000
:
A Splash Screen for true Artisans
Wir haben keine Möglichkeit für die Vonage-Server, um uns eingehende Nachrichten-Webhooks zu geben, so dass wir eine öffentliche URL zu bekommen, werden wir ngrok verwenden, um unsere laufende Laravel-Anwendung zu mappen:
ngrok http 8000
Ngrok up and running
Sie haben jetzt eine öffentliche URL! Der letzte Teil der Konfiguration besteht darin, unsere Webhooks zu erstellen. Gehen Sie also zurück zur Messages Sandbox auf dem Vonage Dashboard. Nehmen Sie die öffentliche URL, die wir haben, und fügen Sie /webhooks/status und /webhooks/inbound in die entsprechenden Felder ein:
Configure your Webhooks here
Testen Sie es!
Gehen Sie zu localhost:8000/message
und senden Sie eine Nachricht!
Hit Submit to watch the magic
Our sandbox is working as expected
Wie macht sie das?
Es ist an der Zeit, in den Code einzutauchen. Die gesamte Logik befindet sich nur in der routes/web.php
Datei und nicht in den Controllern, um die Dinge einfach zu halten. Es gibt zwei wichtige Routen, die die wesentlichen Teile der App ausmachen. Erstens, die Route für ausgehende Nachrichten:
Route::post('/message', static function(Request $request) {
$number = $request->input('number');
$fromNumber = config('vonage.from_number');
$text = 'Hello from Vonage and Laravel :) Please reply to this message with a number between 1 and 100';
$message = new Vonage\Messages\Channel\WhatsApp\WhatsAppText($number, $fromNumber, $text);
$credentials = new Keypair(file_get_contents(config('vonage.private_key_path')), config('vonage.application_id'));
$client = new Vonage\Client($credentials);
$client->messages()->getAPIResource()->setBaseUrl('https://messages-sandbox.nexmo.com/v1/messages');
$client->messages()->send($message);
return view('thanks');
});
Dies ist das Formular und die POST-Anfrage beim Versenden der ersten Nachricht. Die einzige Aufgabe dieser Route besteht darin, die im Formular eingegebene Nummer zu übernehmen und eine WhatsApp-Nachricht zu versenden. Wenn Sie sich fragen, wie wir dies an Vonage senden, finden Sie die Antwort im PHP-SDK von Vonage. Das SDK-Client-Objekt benötigt ein Credentials-Objekt (in diesem Fall eine Keypair-Instanz), dem wir die Umgebungsvariablen Application ID und Private Key Path übergeben, die wir zuvor im Konstruktor erstellt haben.
$credentials = new Keypair(file_get_contents(config('vonage.private_key_path')), config('vonage.application_id'));
$client = new Vonage\Client($credentials);
Weitere Informationen darüber, wie Sie das PHP SDK verwenden können, finden Sie in der ReadMe, finden Sie in der ReadMe das Beispiele für die Verwendung der Nachrichten-API enthält. Um eine Nachricht zu senden, erstellen wir ein WhatsAppText-Objekt, geben die Zielnummer und die zuvor konfigurierte Sandbox from
Nummer, die wir zuvor konfiguriert haben.
Bevor wir die Nachricht über den Client senden, gibt es einen wichtigen Schritt, der speziell für unseren Anwendungsfall gilt:
$client->messages()->getAPIResource()->setBaseUrl('https://messages-sandbox.nexmo.com/v1/messages');
Diese Zeile hier nutzt die entkoppelte Natur des PHP-SDK (alle Teile des SDK können neu konfiguriert oder ausgetauscht werden), um das für die Produktion konfigurierte APIResource-Objekt herauszuziehen und es mit der Sandbox-URL zu überschreiben. Alles, was der Client jetzt tun muss, ist sie zu senden:
$client->messages()->send($message);
Wie man eine eingehende WhatsApp-Nachricht empfängt
Der zweite Teil besteht darin, eine Route zu programmieren, die auf eingehende Webhooks von Vonage wartet - diese werden jedes Mal ausgelöst, wenn jemand auf den im ersten Schritt erstellten Thread antwortet. Hier ist der Endpunkt:
Route::post('/webhooks/inbound', static function(Request $request) {
$data = $request->all();
$number = (int)$data\['text'];
if ($number > 0) {
$randomNumber = random_int(1, 8);
$respondNumber = $number * $randomNumber;
$toNumber = $data\['from'];
$fromNumber = config('vonage.from_number');
$text = "The answer is " . $respondNumber . ", we multiplied by " . $randomNumber . ".";
$message = new Vonage\Messages\Channel\WhatsApp\WhatsAppText($toNumber, $fromNumber, $text);
$credentials = new Keypair(file_get_contents(config('vonage.private_key_path')), config('vonage.application_id'));
$client = new Vonage\Client($credentials);
$client->messages()->getAPIResource()->setBaseUrl('https://messages-sandbox.nexmo.com/v1/messages');
$client->messages()->send($message);
});
Hier extrahieren wir die Details, die wir benötigen, um auf die Nachricht zu antworten - nämlich die Telefonnummer, an die geantwortet werden soll, und die Nummer, die als Teil der Nachricht gesendet wurde. Mit diesen Informationen wird die gesendete Nummer mit einer Zufallszahl zwischen 1 und 8 multipliziert, und wir senden eine Antwort mit der gleichen Struktur wie bei der ursprünglichen Nachricht.
Schlussfolgerung
Und da haben wir es: Möglichkeiten zur Interaktion über WhatsApp in Vonage! Wie Sie sich vorstellen können, ist diese Art von Einrichtung ideal für automatisierte Chatbots, wie z. B. eine Helpline, aber was werden Sie bauen? Lassen Sie es uns wissen auf dem Vonage Community Slack, rjeder auf X, früher bekannt als Twitter. oder melde dich bei mir auf Mastodon.
Weitere Ressourcen
Share:
)
Als ausgebildeter Schauspieler mit einer Dissertation in Standup-Comedy bin ich über die Meetup-Szene zur PHP-Entwicklung gekommen. Man findet mich, wenn ich über Technik spreche oder schreibe, oder wenn ich seltsame Platten aus meiner Vinylsammlung spiele oder kaufe.