Airtable ist ein Online-Datenbank-Tool, mit dem Sie verknüpfte Datensätze mit einer benutzerfreundlichen Oberfläche erstellen können. Anstatt Admin-Dashboards für Ihre Daten erstellen zu müssen, können Sie mit Airtable Daten über eine zugängliche, kollaborative und (ich wage zu sagen) unterhaltsame Schnittstelle abfragen, sortieren und filtern.

Am Ende dieses Tutorials werden Sie in der Lage sein, SMS-Nachrichten, die von Ihren Benutzern gesendet wurden, in einer Airtable-Basis zu speichern und sie mit der Vonage Messages API.

Der Code für dieses Tutorial ist auf GitHub.

Voraussetzungen

• Ein Airtable-Konto

• Node.js auf Ihrem Rechner installiert

• ngrok um den Code auf Ihrem lokalen Rechner für die Außenwelt zugänglich zu machen

• Die Vonage CLI: npm install @vonage/cli -g

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.

Einrichten einer Airtable Base

Die Datenbanken in Airtable werden als Basen bezeichnet und bestehen aus mehreren Tabellen. Wie alle relationalen Datenbanken können diese Tabellen über gemeinsame Felder verknüpft werden. Während Sie mit Airtable über die API interagieren, müssen Sie zunächst die Datenbank auf der Website einrichten.

Wie Sie oben sehen können, erstellen Sie eine Messages- und eine Numbers-Tabelle. Die Tabelle Messages sollte eine Verknüpfung mit der Tabelle Numbers haben, die in Ihrem Namen ein neues Feld in Numbers erstellt. Beachten Sie, dass bei Tabellen-/Feldnamen zwischen Groß- und Kleinschreibung unterschieden wird. Fügen Sie Ihre Telefonnummer in die Numbers-Tabelle ein und verwenden Sie dabei das Standardformat für Vonage-Nummern (z. B. hätte eine US-Nummer das Format 14155550101, während eine britische Nummer das Format 447700900123 hätte).

In Ihrem Airtable Account sollten Sie auch Ihren API-Schlüssel generieren und sich diesen notieren.

Ngrok ausführen

Unsere Vonage-Anwendung benötigt eine öffentliche URL, und ngrok ermöglicht es Ihnen, Anwendungen, die auf localhost laufen, öffentlich zu machen. Für weitere Informationen, lesen Sie unseren Beitrag rund um die lokale Entwicklung mit ngrok. Nach der Einrichtung müssen Sie die Anwendung auf Port 3000 ausführen - dem Port, auf dem wir später unsere Express.js-Anwendung bauen werden:

$ ngrok http 3000

Wenn Sie ngrok ausführen, werden Sie sehen, dass localhost:3000 eine Weiterleitungs-URL erhält, die Sie verwenden können, um öffentlichen Zugriff auf Ihre lokale Anwendung zu ermöglichen. Sie sieht dann etwa so aus https://qwertyui.ngrok.io. Sie werden diese Adresse später wieder brauchen, also merken Sie sie sich.

Erstellen einer Vonage-Anwendung

Um mit der Messages API zu beginnen, müssen Sie eine virtuelle Telefonnummer erwerben und eine neue Vonage Anwendung einrichten. Obwohl Sie die Messages API nur für SMS verwenden werden, können Sie sie leicht auf WhatsApp, Facebook Messenger, Viber und andere Anwendungen erweitern. Erstellen Sie ein Verzeichnis für Ihr neues Projekt, navigieren Sie in Ihrem Terminal dorthin und führen Sie die folgenden Befehle aus:

# Search numbers that can send/receive SMS (replace GB for other regions)
$ vonage numbers:search GB

# Buy a number from the list
$ vonage numbers:buy [NUMBER_FROM_LIST] [COUNTRYCODE]

# Create a new Vonage messages application
$ vonage apps:create "Application Name" --messages_inbound_url=https://7YOUR_NGROK_URL/inbound --messages_status_url=YOUR_NGROK_URL/status 

# Link your number to your application
$ vonage link:app --number=VONAGE_NUMBER APPLICATION_ID

Abhängigkeiten installieren

Der letzte Schritt vor dem Schreiben von Code ist die Installation von Abhängigkeiten:

# Create package.json (you may leave all answers as default)
$ npm init

# Install dependencies
$ npm install @vonage/server-sdk@beta express body-parser airtable

Express.js-Anwendung einrichten

Erstellen Sie eine index.js Datei und richten Sie eine Standard-Express.js-Anwendung ein:

const app = require('express')();
const bodyParser = require('body-parser');
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true }));

// Other code will go in here

app.listen(3000);

Einen Inbound-Webhook-Handler erstellen

Beim Einrichten Ihrer Vonage-Anwendung haben Sie eine URL für eingehende Nachrichten angegeben, die auf der ngrok-Adresse basiert. Als Nächstes werden Sie die Route erstellen, die diese eingehenden Daten verarbeitet:

app.post('/inbound', async (req, res) => {
  console.log(req.body);
  res.status(200).end();
}

Checkpoint! Probieren Sie Ihre Anwendung aus. Führen Sie Ihre Anwendung mit node index.jsund senden Sie dann eine SMS an Ihre Vonage-Nummer. Sie sollten die Daten dieses Anrufs in Ihrem Terminal sehen.

SMS-Nachrichten in Airtable protokollieren

Großartig! Sie haben jetzt einen funktionierenden Express.js-Server, der eingehende SMS-Nachrichten annehmen kann. Jetzt können wir sie innerhalb des Handlers für eingehende Nachrichten an Airtable weiterleiten. Bevor Sie dieses Snippet verwenden, sollten Sie beachten, dass Airtable bei verknüpften Feldern die Airtable-ID des Feldes verlangt, nicht den Wert. Wenn Sie zum Beispiel einen Numbers-Datensatz für 4412345678900 haben, hat dieser Datensatz auch eine ID. Wenn Sie einen Nachrichtendatensatz erstellen, benötigen Sie die ID des Datensatzes - nicht 4412345678900.

const Airtable = require('airtable');
const base = new Airtable({ apiKey: config.AIRTABLE_KEY }).base('YOUR_AIRTABLE_BASE_ID');

app.post('/inbound', async (req, res) => {
  const { from, text } = req.body;

  base('Messages').select({
		filterByFormula: `Number=${from}`
	}).eachPage(records => {
		createMessage(text, records[0].fields.Number[0])
	});

	function createMessage(message, numberId) {
		base('Messages').create({
			Message: message,
			Number: [numberId]
		}, err => {
			if (err) { console.error(err); return; }
			console.log('Message saved to Airtable')
			res.status(200).end();
		})
	}

  res.status(200).end();
}

Am Anfang benötigen Sie den Airtable-JavaScript-Client und initialisieren ihn mit Ihrer Basis-ID. Wenn 'https://airtable.com/tblAuZ8qFuP2I8mDh/viwVyLmBMW772S9sd' die URL Ihrer Airtable-Webseite ist, dann ist tblAuZ8qFuP2I8mDh die Basis-ID (die zweite lange Zeichenfolge ist die Ansicht, die wir nicht benötigen).

Im ersten Abschnitt wählen Sie alle Nachrichten aus, bei denen der Wert Number gleich der eingehenden MSISDN (Telefonnummer) ist, ermitteln dann die Airtable ID dieses Number-Feldes und übergeben sie an unsere createMessage Funktion.

Die Funktion createMessage Funktion erstellt eine neue Airtable-Zeile und gibt nach Abschluss eine Erfolgs- oder Fehlermeldung auf der Konsole aus.

Checkpoint! Probieren Sie Ihre Anwendung aus. Starten Sie Ihre Anwendung neu und senden Sie eine SMS an Ihre virtuelle Rufnummer. Sie sollten eine neue Nachricht in der Tabelle Nachrichten sehen.

Neue Numbers in Airtable protokollieren

Wenn Sie eine SMS von einer Nummer senden, die noch nicht in Ihrer Numbers-Tabelle enthalten ist, erhalten Sie eine Fehlermeldung von Airtable. Wenn Sie eine Nachricht erhalten, müssen Sie prüfen, ob Sie bereits einen Numbers-Datensatz haben. Ist dies nicht der Fall, legen Sie zuerst einen an, und wenn dies der Fall ist, sollten Sie wie gewohnt eine Nachricht erstellen. Lassen Sie uns die Nachrichtenauswahl ändern und eine neue Funktion zum Erstellen einer Numbers erstellen:

app.post('/inbound', async (req, res) => {
  const { from, text } = req.body;

  base('Messages').select({
		filterByFormula: `Number=${from}`
	}).eachPage(records => {
		if (records.length == 0) {
			createNumber(text, from)
		} else {
			createMessage(text, records[0].fields.Number[0])
		}
	});

	function createNumber(message, from) {
			base('Numbers').create({
				Number: from
			}, (err, record) => {
				if (err) { console.error(err); return; }
				createMessage(message, record.getId())
			})
    }

	function createMessage(message, numberId) {
		// ...
	}

  res.status(200).end();
}

Wenn der eingehenden Telefonnummer keine Datensätze zugeordnet sind, erstellen Sie zunächst einen Datensatz für die Nummer und dann einen für die Nachricht. Wenn ein Datensatz vorhanden ist, erstellen wir direkt eine Nachricht.

Kontrollpunkt! Löschen Sie alle Messages und Numbers von Ihrer Airtable-Basis. Starten Sie Ihre Anwendung neu und senden Sie eine SMS an Ihre virtuelle Telefonnummer. Sie sollten eine neue Numbers und eine neue Nachricht in Airtable sehen.

Bestätigung an den Benutzer senden

Die Tatsache, dass Sie jetzt die Daten korrekt protokollieren, ist brillant, aber Ihre Nutzer haben keine Ahnung, dass ihre Nachricht angekommen ist. Das müssen wir ändern.

Binden Sie vor Ihrem Handler für eingehende Nachrichten den Vonage JavaScript Node.js-Client ein und initialisieren Sie ihn:

const Vonage = require('@vonage/server-sdk');
const vonage = new Vonage({
  apiKey: config.VONAGE_KEY,
  apiSecret: config.VONAGE_SECRET,
  applicationId: config.VONAGE_APPLICATION_ID,
  privateKey: './private.key'
});

Die Datei private.key Datei sollte in diesem Verzeichnis erstellt worden sein, als Sie eine neue Vonage-Anwendung erstellt haben. Vergewissern Sie sich, dass sie sich dort befindet (wenn nicht, verschieben Sie sie in dieses Verzeichnis), und Sie sind startklar.

Da Ihr Client nun eingebunden und initialisiert ist, aktualisieren Sie die createMessage Funktion, um eine SMS als Antwort zu senden, sobald Sie den Airtable-Datensatz gespeichert haben:

function createMessage(message, numberId) {
	base('Messages').create({
		Message: message,
		Number: [numberId]
	}, err => {
		if (err) { console.error(err); return; }
		vonage.channel.send(
			{ "type": "sms", "number": req.body.from },
			{ "type": "sms", "number": YOUR_VONAGE_NUMBER },
			{ "content": { "type": "text", "text": "Thank you for getting in touch. We will ring you back as soon as possible." } },
			vonageErr => {
					if(vonageErr) { console.error(err); return; } 
			}
		), 
		res.status(200).end();
	})
}

Und damit ist die Demo abgeschlossen. Starten Sie Ihre Anwendung noch einmal neu und probieren Sie sie aus. Wenn Sie eine Nachricht eingeben, sollten Sie nun eine Antwort über die neue Vonage Messages API erhalten.

Wie geht es weiter?

Es gibt viele Möglichkeiten, auf dieser Anwendung aufzubauen - von einer robusteren Fehlerbehandlung über die Abfrage des Benutzernamens und dessen Verknüpfung mit einer Nummer bis hin zu einem vollständigen Protokoll jeder empfangenen und gesendeten Interaktion. Werden Sie ruhig kreativ!

Aber lehnen Sie sich erst einmal zurück und warten Sie auf die Texte, die Sie erhalten.

Das vollständige Codebeispiel finden Sie unter https://github.com/nexmo-community/save-sms-airtable-express